diff --git a/.changeset/fifty-coins-enjoy.md b/.changeset/fifty-coins-enjoy.md deleted file mode 100644 index 6bc622bf8a7..00000000000 --- a/.changeset/fifty-coins-enjoy.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -'@primer/react': patch ---- - -When passing an `id` prop to ActionMenu.Button, it will be passed as the rendered button element's `id` attribute instead of being set as an automatically generated ID. - - diff --git a/.changeset/five-otters-dance.md b/.changeset/five-otters-dance.md deleted file mode 100644 index 99ed240cf66..00000000000 --- a/.changeset/five-otters-dance.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -Update to @primer/behaviors v1.5.1 diff --git a/.changeset/itchy-jokes-compare.md b/.changeset/itchy-jokes-compare.md new file mode 100644 index 00000000000..38e3a73b545 --- /dev/null +++ b/.changeset/itchy-jokes-compare.md @@ -0,0 +1,5 @@ +--- +'@primer/react': patch +--- + +Changes the focus styling of input components such as `Textarea`, `TextInput`, `TextInputWithTokens` and `Select` from using `border` and `box-shadow` to use `outline` only for better border rendering and scrollbar support. diff --git a/.changeset/little-apples-own.md b/.changeset/little-apples-own.md new file mode 100644 index 00000000000..de440a51e52 --- /dev/null +++ b/.changeset/little-apples-own.md @@ -0,0 +1,5 @@ +--- +'@primer/react': minor +--- + +Update SSRProvider, useSSRSafeId to use the native React 18 useId() instead of @react-aria/ssr diff --git a/.changeset/pretty-trainers-rhyme.md b/.changeset/pretty-trainers-rhyme.md deleted file mode 100644 index ac91ac100d0..00000000000 --- a/.changeset/pretty-trainers-rhyme.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -ActionList: Fix bug that did not allow both inline and block description at the same time diff --git a/.changeset/proud-dingos-occur.md b/.changeset/proud-dingos-occur.md deleted file mode 100644 index a9c0a86f44e..00000000000 --- a/.changeset/proud-dingos-occur.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -Make resize vertical splitter keyboard accessible diff --git a/.changeset/selfish-beans-cheat.md b/.changeset/selfish-beans-cheat.md deleted file mode 100644 index 4732db0fbb2..00000000000 --- a/.changeset/selfish-beans-cheat.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -Link: Add `inline` prop to tag links inside a text block, underlined with accessibility setting `[data-a11y-link-underlines]` diff --git a/.changeset/sweet-pens-occur.md b/.changeset/sweet-pens-occur.md deleted file mode 100644 index 0674ba03c10..00000000000 --- a/.changeset/sweet-pens-occur.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@primer/react': minor ---- - -TextArea: Add contrast property diff --git a/.changeset/thin-ladybugs-travel.md b/.changeset/thin-ladybugs-travel.md new file mode 100644 index 00000000000..93489b128ce --- /dev/null +++ b/.changeset/thin-ladybugs-travel.md @@ -0,0 +1,5 @@ +--- +'@primer/react': patch +--- + +Ensure ConfirmationDialog adds host element to the DOM diff --git a/.eslintrc.js b/.eslintrc.js index b8784d93e39..7c5cb359fcb 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -138,11 +138,6 @@ module.exports = { 'error', { paths: [ - { - name: '@react-aria/ssr', - importNames: ['useSSRSafeId'], - message: 'Please use the `useId` hook from `src/hooks/useId.ts` instead', - }, { name: 'react', importNames: ['useLayoutEffect'], diff --git a/.github/actions/pagerduty/action.yml b/.github/actions/pagerduty/action.yml index 6c576dcff63..00065517dd8 100644 --- a/.github/actions/pagerduty/action.yml +++ b/.github/actions/pagerduty/action.yml @@ -38,7 +38,7 @@ runs: - name: Set up Node.js uses: actions/setup-node@v3 with: - node-version: 18 + node-version: 20 - name: Get PagerDuty Schedule id: pagerduty uses: actions/github-script@v6 diff --git a/.github/workflows/assign_release_conductor.yml b/.github/workflows/assign_release_conductor.yml index 74182a8deeb..ff5d2a81b10 100644 --- a/.github/workflows/assign_release_conductor.yml +++ b/.github/workflows/assign_release_conductor.yml @@ -17,7 +17,7 @@ jobs: - uses: actions/checkout@v4 - uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 - run: npm ci - uses: ./.github/actions/pagerduty id: pagerduty diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index ba3f426b7a0..305700b36da 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -25,7 +25,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies run: npm ci @@ -41,7 +41,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies @@ -62,7 +62,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies @@ -83,7 +83,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies @@ -101,7 +101,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies @@ -126,10 +126,10 @@ jobs: shard: [1, 2, 3, 4] steps: - uses: actions/checkout@v4 - - name: Use Node.js 18.x + - name: Use Node.js 20.x uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies run: npm ci @@ -163,10 +163,10 @@ jobs: needs: vrt-runner steps: - uses: actions/checkout@v4 - - name: Use Node.js 18.x + - name: Use Node.js 20.x uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: install dependencies run: npm ci @@ -194,10 +194,10 @@ jobs: shard: [1, 2] steps: - uses: actions/checkout@v4 - - name: Use Node.js 18.x + - name: Use Node.js 20.x uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies run: npm ci @@ -231,10 +231,10 @@ jobs: needs: aat-runner steps: - uses: actions/checkout@v4 - - name: Use Node.js 18.x + - name: Use Node.js 20.x uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: install dependencies run: npm ci @@ -259,10 +259,10 @@ jobs: steps: - name: Checkout repository uses: actions/checkout@v4 - - name: Use Node.js 18.x + - name: Use Node.js 20.x uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies run: npm ci @@ -277,7 +277,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies run: npm ci diff --git a/.github/workflows/consumer_test.yml b/.github/workflows/consumer_test.yml index 7520fa698b2..7f1b8ad2702 100644 --- a/.github/workflows/consumer_test.yml +++ b/.github/workflows/consumer_test.yml @@ -14,7 +14,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: npm - name: Install dependencies run: npm ci diff --git a/.github/workflows/pull_request.yml b/.github/workflows/pull_request.yml index c9b1003ab8d..1da519d0301 100644 --- a/.github/workflows/pull_request.yml +++ b/.github/workflows/pull_request.yml @@ -16,7 +16,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 - name: Get or Create Comment uses: actions/github-script@v7 diff --git a/.github/workflows/release-schedule.yml b/.github/workflows/release-schedule.yml index c32566a281a..ace13300549 100644 --- a/.github/workflows/release-schedule.yml +++ b/.github/workflows/release-schedule.yml @@ -30,7 +30,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 - name: Install packages for github-script run: npm i date-fns - name: Create Release Issue diff --git a/.github/workflows/statuses.yml b/.github/workflows/statuses.yml index 8c759d43aee..cf29166af88 100644 --- a/.github/workflows/statuses.yml +++ b/.github/workflows/statuses.yml @@ -22,7 +22,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 - name: Install node deps run: npm ci - name: Install ruby deps diff --git a/.github/workflows/storybook-tests.yml b/.github/workflows/storybook-tests.yml index 6adc4bfecce..41308daa00f 100644 --- a/.github/workflows/storybook-tests.yml +++ b/.github/workflows/storybook-tests.yml @@ -13,7 +13,7 @@ jobs: - uses: actions/checkout@v4 - uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies run: npm i diff --git a/.github/workflows/vrt.yml b/.github/workflows/vrt.yml index 5bb901b27fa..e5737845586 100644 --- a/.github/workflows/vrt.yml +++ b/.github/workflows/vrt.yml @@ -37,7 +37,7 @@ jobs: - name: Set up Node.js uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 cache: 'npm' - name: Install dependencies run: npm ci diff --git a/.nvmrc b/.nvmrc index 3f430af82b3..9a2a0e219c9 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -v18 +v20 diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-colorblind-linux.png similarity index 55% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-colorblind-linux.png index 6eebd6ca8c7..b7ac757e92b 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-colorblind-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-colorblind-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-dimmed-linux.png similarity index 56% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-colorblind-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-dimmed-linux.png index 3a8fb2fe2f0..9a2a1cfd2b4 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-colorblind-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-dimmed-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-high-contrast-linux.png similarity index 54% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-high-contrast-linux.png index 2e5424b2215..955a1384784 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-high-contrast-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-linux.png similarity index 55% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-linux.png index 6eebd6ca8c7..b7ac757e92b 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-high-contrast-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-tritanopia-linux.png similarity index 55% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-high-contrast-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-tritanopia-linux.png index fd7a03a7461..b7ac757e92b 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-high-contrast-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-tritanopia-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-colorblind-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-colorblind-linux.png similarity index 56% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-colorblind-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-colorblind-linux.png index a798833b107..028051f7d2d 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-colorblind-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-colorblind-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-high-contrast-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-high-contrast-linux.png similarity index 56% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-high-contrast-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-high-contrast-linux.png index a0d34354240..ad576c9df52 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-high-contrast-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-high-contrast-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-linux.png similarity index 56% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-linux.png index a798833b107..028051f7d2d 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-tritanopia-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-tritanopia-linux.png similarity index 56% rename from .playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-tritanopia-linux.png rename to .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-tritanopia-linux.png index a798833b107..028051f7d2d 100644 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-tritanopia-linux.png and b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-tritanopia-linux.png differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-colorblind-linux.png deleted file mode 100644 index 96fa576cb44..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-dimmed-linux.png deleted file mode 100644 index 95fc456b5a1..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-high-contrast-linux.png deleted file mode 100644 index 023f76c77f7..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-linux.png deleted file mode 100644 index 83a20efc55d..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-tritanopia-linux.png deleted file mode 100644 index 83a20efc55d..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-colorblind-linux.png deleted file mode 100644 index 0a0d7b132f4..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-high-contrast-linux.png deleted file mode 100644 index dae7d216dbd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-linux.png deleted file mode 100644 index 7ed18997013..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-tritanopia-linux.png deleted file mode 100644 index 9e2ca27cf01..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Danger-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-colorblind-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-dimmed-linux.png deleted file mode 100644 index 56d48dbc00a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-high-contrast-linux.png deleted file mode 100644 index 857e7d3bc0c..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-tritanopia-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-colorblind-linux.png deleted file mode 100644 index 5762cf818cd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-high-contrast-linux.png deleted file mode 100644 index cd7ea93d91a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-tritanopia-linux.png deleted file mode 100644 index 5762cf818cd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Default-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-colorblind-linux.png deleted file mode 100644 index 321b19d37f3..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-dimmed-linux.png deleted file mode 100644 index 7b9171e6cd9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-high-contrast-linux.png deleted file mode 100644 index 1a6f14f4040..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-linux.png deleted file mode 100644 index 321b19d37f3..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-tritanopia-linux.png deleted file mode 100644 index 321b19d37f3..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-colorblind-linux.png deleted file mode 100644 index 29cde67f322..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-high-contrast-linux.png deleted file mode 100644 index 8b9f8c96d23..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-linux.png deleted file mode 100644 index 880a2e50e11..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-tritanopia-linux.png deleted file mode 100644 index 29cde67f322..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Disabled-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-colorblind-linux.png deleted file mode 100644 index 2f381f9ff5f..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-dimmed-linux.png deleted file mode 100644 index 16d708c3b0a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-high-contrast-linux.png deleted file mode 100644 index 32760b16ee1..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-linux.png deleted file mode 100644 index 40447caeda5..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-tritanopia-linux.png deleted file mode 100644 index 2f381f9ff5f..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-colorblind-linux.png deleted file mode 100644 index 4051b7bdb9f..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-high-contrast-linux.png deleted file mode 100644 index abc781a61bf..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-linux.png deleted file mode 100644 index 82685e27347..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-tritanopia-linux.png deleted file mode 100644 index 4051b7bdb9f..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-Variants-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-colorblind-linux.png deleted file mode 100644 index 3eeceac5f96..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-dimmed-linux.png deleted file mode 100644 index 4b7ff48113a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-high-contrast-linux.png deleted file mode 100644 index ea3f43522f6..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-linux.png deleted file mode 100644 index 584be2216df..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-tritanopia-linux.png deleted file mode 100644 index 3eeceac5f96..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-colorblind-linux.png deleted file mode 100644 index 8ca573d8cb9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-high-contrast-linux.png deleted file mode 100644 index cadeebdeb0a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-linux.png deleted file mode 100644 index 8ca573d8cb9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-tritanopia-linux.png deleted file mode 100644 index 8ca573d8cb9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Invisible-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-colorblind-linux.png deleted file mode 100644 index afd7b05b4c9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-dimmed-linux.png deleted file mode 100644 index d35df7a4ec0..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-high-contrast-linux.png deleted file mode 100644 index 3eba9aac4ad..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-linux.png deleted file mode 100644 index afd7b05b4c9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-tritanopia-linux.png deleted file mode 100644 index afd7b05b4c9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-high-contrast-linux.png deleted file mode 100644 index 884474df496..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-linux.png deleted file mode 100644 index ad5f989bde0..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-tritanopia-linux.png deleted file mode 100644 index 3a8fb2fe2f0..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Large-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-colorblind-linux.png deleted file mode 100644 index 36d2a45986e..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-dimmed-linux.png deleted file mode 100644 index 6af5e736bb0..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-high-contrast-linux.png deleted file mode 100644 index 9c595667f02..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-linux.png deleted file mode 100644 index 36d2a45986e..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-tritanopia-linux.png deleted file mode 100644 index 36d2a45986e..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-colorblind-linux.png deleted file mode 100644 index d45c0170307..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-high-contrast-linux.png deleted file mode 100644 index b533d6b9181..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-linux.png deleted file mode 100644 index b58cb0b1a9c..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-tritanopia-linux.png deleted file mode 100644 index d45c0170307..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Leading-Visual-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-colorblind-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-dimmed-linux.png deleted file mode 100644 index 56d48dbc00a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-high-contrast-linux.png deleted file mode 100644 index 857e7d3bc0c..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-tritanopia-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-colorblind-linux.png deleted file mode 100644 index 5762cf818cd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-high-contrast-linux.png deleted file mode 100644 index cd7ea93d91a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-linux.png deleted file mode 100644 index 6eebd6ca8c7..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-tritanopia-linux.png deleted file mode 100644 index 5762cf818cd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Medium-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-colorblind-linux.png deleted file mode 100644 index aa0f3d2ac3a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-dimmed-linux.png deleted file mode 100644 index e331fe785f4..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-high-contrast-linux.png deleted file mode 100644 index 35074bda2ab..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-linux.png deleted file mode 100644 index aa0f3d2ac3a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-tritanopia-linux.png deleted file mode 100644 index aa0f3d2ac3a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-colorblind-linux.png deleted file mode 100644 index e3f7ea01ccd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-high-contrast-linux.png deleted file mode 100644 index cbdddbc1c78..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-linux.png deleted file mode 100644 index a2dfc789df8..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-tritanopia-linux.png deleted file mode 100644 index e3f7ea01ccd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Outline-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-colorblind-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-dimmed-linux.png deleted file mode 100644 index 56d48dbc00a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-high-contrast-linux.png deleted file mode 100644 index 857e7d3bc0c..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-tritanopia-linux.png deleted file mode 100644 index e3d5a91a66b..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-colorblind-linux.png deleted file mode 100644 index 5762cf818cd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-high-contrast-linux.png deleted file mode 100644 index cd7ea93d91a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-tritanopia-linux.png deleted file mode 100644 index 5762cf818cd..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Playground-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-colorblind-linux.png deleted file mode 100644 index dc4d05ce9d9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-dimmed-linux.png deleted file mode 100644 index 6c6ae9fa1db..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-high-contrast-linux.png deleted file mode 100644 index 5244e303e67..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-linux.png deleted file mode 100644 index 3d0da735bb5..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-tritanopia-linux.png deleted file mode 100644 index dc4d05ce9d9..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-colorblind-linux.png deleted file mode 100644 index a052c678e1a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-high-contrast-linux.png deleted file mode 100644 index cf8968e0ee4..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-linux.png deleted file mode 100644 index aee8843bc04..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-tritanopia-linux.png deleted file mode 100644 index a052c678e1a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Primary-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-colorblind-linux.png deleted file mode 100644 index aff81a49101..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-dimmed-linux.png deleted file mode 100644 index 98b02c72117..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-high-contrast-linux.png deleted file mode 100644 index ecd451e4315..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-linux.png deleted file mode 100644 index aff81a49101..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-tritanopia-linux.png deleted file mode 100644 index aff81a49101..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-colorblind-linux.png deleted file mode 100644 index c8f16253757..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-high-contrast-linux.png deleted file mode 100644 index ac720db602f..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-linux.png deleted file mode 100644 index ebc8a536b39..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-tritanopia-linux.png deleted file mode 100644 index c8f16253757..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Small-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-dimmed-linux.png deleted file mode 100644 index d372cb74ade..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-high-contrast-linux.png deleted file mode 100644 index 59b0d1f0d2c..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-colorblind-linux.png deleted file mode 100644 index 50ce267db31..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-linux.png deleted file mode 100644 index f197a580cd3..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-tritanopia-linux.png deleted file mode 100644 index 50ce267db31..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Action-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-colorblind-linux.png deleted file mode 100644 index 356e04c2210..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-dimmed-linux.png deleted file mode 100644 index 04cb590fdb1..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-high-contrast-linux.png deleted file mode 100644 index f72ac95fbdc..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-linux.png deleted file mode 100644 index 2b9856fc2e5..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-tritanopia-linux.png deleted file mode 100644 index 356e04c2210..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-colorblind-linux.png deleted file mode 100644 index d464f75c686..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-high-contrast-linux.png deleted file mode 100644 index 6d0cb868d34..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-linux.png deleted file mode 100644 index b711754a8fa..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-tritanopia-linux.png deleted file mode 100644 index d464f75c686..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Counter-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-colorblind-linux.png deleted file mode 100644 index 9003e7c4334..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-dimmed-linux.png deleted file mode 100644 index 1d2a6bcc090..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-linux.png deleted file mode 100644 index 9003e7c4334..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-tritanopia-linux.png deleted file mode 100644 index 9003e7c4334..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-colorblind-linux.png deleted file mode 100644 index 49a1746bcd5..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-high-contrast-linux.png deleted file mode 100644 index 8b2074ab8f7..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-tritanopia-linux.png deleted file mode 100644 index 49a1746bcd5..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-Trailing-Visual-light-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-colorblind-linux.png deleted file mode 100644 index 6efca92fe5a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-dimmed-linux.png deleted file mode 100644 index 4cf18cdcfb2..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-dimmed-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-high-contrast-linux.png deleted file mode 100644 index 8d112d8aa18..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-linux.png deleted file mode 100644 index 32ca24b8177..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-tritanopia-linux.png deleted file mode 100644 index 6efca92fe5a..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-tritanopia-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-colorblind-linux.png deleted file mode 100644 index f7df9bdde31..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-colorblind-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-high-contrast-linux.png deleted file mode 100644 index 0d453a90b61..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-high-contrast-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-linux.png deleted file mode 100644 index c5fd014483e..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-linux.png and /dev/null differ diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-tritanopia-linux.png deleted file mode 100644 index f7df9bdde31..00000000000 Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-tritanopia-linux.png and /dev/null differ diff --git a/CHANGELOG.md b/CHANGELOG.md index 7c621cff821..e862b512482 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,39 @@ # @primer/components +## 36.3.1 + +### Patch Changes + +- [#3998](https://github.com/primer/react/pull/3998) [`dd285e2ac`](https://github.com/primer/react/commit/dd285e2ac83eb282ae7c111fd44e2dffaf15ccb2) Thanks [@joshblack](https://github.com/joshblack)! - Remove changes to focus outline to prevent double focus rings from showing + +## 36.3.0 + +### Minor Changes + +- [#3963](https://github.com/primer/react/pull/3963) [`e16927b5a`](https://github.com/primer/react/commit/e16927b5aef72a2d6b78705066fd26b3741b73df) Thanks [@mperrotti](https://github.com/mperrotti)! - Adds "unavailable" status to StateLabel + + + +- [#3484](https://github.com/primer/react/pull/3484) [`e40378951`](https://github.com/primer/react/commit/e4037895105c7e86e79c5bb6fbafb86e715337ba) Thanks [@ValbertMartins](https://github.com/ValbertMartins)! - TextArea: Add contrast property + +### Patch Changes + +- [#3897](https://github.com/primer/react/pull/3897) [`6b0c118b3`](https://github.com/primer/react/commit/6b0c118b34e97c558991ebdc17a13350296245a8) Thanks [@mperrotti](https://github.com/mperrotti)! - When passing an `id` prop to ActionMenu.Button, it will be passed as the rendered button element's `id` attribute instead of being set as an automatically generated ID. + + + +- [#3960](https://github.com/primer/react/pull/3960) [`ec8a2cadd`](https://github.com/primer/react/commit/ec8a2cadda01a3a3463380b911922b9c28e4e241) Thanks [@pksjce](https://github.com/pksjce)! - Update to @primer/behaviors v1.5.1 + +- [#3945](https://github.com/primer/react/pull/3945) [`40b29787e`](https://github.com/primer/react/commit/40b29787ec4c8f709e7522147e58bd03e51b28e7) Thanks [@siddharthkp](https://github.com/siddharthkp)! - ActionList: Fix bug that did not allow both inline and block description at the same time + +- [#3903](https://github.com/primer/react/pull/3903) [`f62ec728a`](https://github.com/primer/react/commit/f62ec728acd5c90f105c3e3c5162a69dbe0c4b6d) Thanks [@pksjce](https://github.com/pksjce)! - Make resize vertical splitter keyboard accessible + +- [#3946](https://github.com/primer/react/pull/3946) [`e08432d54`](https://github.com/primer/react/commit/e08432d54dd45a5e793719509dc78657570dde0b) Thanks [@siddharthkp](https://github.com/siddharthkp)! - Link: Add `inline` prop to tag links inside a text block, underlined with accessibility setting `[data-a11y-link-underlines]` + +- [#3983](https://github.com/primer/react/pull/3983) [`43d1dce4a`](https://github.com/primer/react/commit/43d1dce4a103b5e23064e8a32a7bb27677dbbb95) Thanks [@TylerJDev](https://github.com/TylerJDev)! - Readjust order of `PageLayout.Pane` contents + +- [#3972](https://github.com/primer/react/pull/3972) [`87028d2b9`](https://github.com/primer/react/commit/87028d2b963b788f1525f6f9326ed7eb1b7346d6) Thanks [@iulia-b](https://github.com/iulia-b)! - Update MarkdownEditor to correctly identify non-standard formatted tasklist items + ## 36.2.0 ### Minor Changes diff --git a/contributor-docs/CONTRIBUTING.md b/contributor-docs/CONTRIBUTING.md index 7522dcdec6c..d65e5436712 100644 --- a/contributor-docs/CONTRIBUTING.md +++ b/contributor-docs/CONTRIBUTING.md @@ -151,7 +151,7 @@ If your component doesn't use DOM globals, it likely won't cause layout shift du ### Adding the `sx` prop -Each component should accept a prop called `sx` that allows for setting theme-aware ad-hoc styles. See the [overriding styles](https://primer.style/components/overriding-styles) doc for more information on using the prop. +Each component should accept a prop called `sx` that allows for setting theme-aware ad-hoc styles. See the [overriding styles](https://primer.style/react/overriding-styles) doc for more information on using the prop. To add the `sx` prop to your component: import the default export from the `sx` module, add it to your style definition, and add the appropriate prop types. **The `sx` prop should go at the _very end_ of your style definition.** diff --git a/e2e/components/StateLabel.test.ts b/e2e/components/StateLabel.test.ts index add2a97d42e..da6fe8c1622 100644 --- a/e2e/components/StateLabel.test.ts +++ b/e2e/components/StateLabel.test.ts @@ -275,6 +275,33 @@ test.describe('StateLabel', () => { } }) + test.describe('Unavailable', () => { + for (const theme of themes) { + test.describe(theme, () => { + test('default @vrt', async ({page}) => { + await visit(page, { + id: 'components-statelabel-features--unavailable', + globals: { + colorScheme: theme, + }, + }) + + // Default state + expect(await page.screenshot()).toMatchSnapshot(`StateLabel.Unavailable.${theme}.png`) + }) + + test('axe @aat', async ({page}) => { + await visit(page, { + id: 'components-statelabel-features--unavailable', + globals: { + colorScheme: theme, + }, + }) + }) + }) + } + }) + test.describe('Small', () => { for (const theme of themes) { test.describe(theme, () => { diff --git a/e2e/components/drafts/Button2.test.ts b/e2e/components/drafts/Button2.test.ts deleted file mode 100644 index 5e2f140937e..00000000000 --- a/e2e/components/drafts/Button2.test.ts +++ /dev/null @@ -1,517 +0,0 @@ -import {test, expect} from '@playwright/test' -import {visit} from '../../test-helpers/storybook' -import {themes} from '../../test-helpers/themes' - -test.describe('Button', () => { - test.describe('Playground', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button--playground', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Playground.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button--playground', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Danger', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--danger', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Danger.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--danger', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Default', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button--default', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Default.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button--default', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Disabled', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--disabled', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Disabled.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--disabled', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Invisible', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--invisible', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Invisible.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--invisible', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Large', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--large', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Large.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--large', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Leading Visual', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--leading-visual', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Leading Visual.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--leading-visual', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Medium', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--medium', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Medium.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--medium', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Outline', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--outline', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Outline.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--outline', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Primary', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--primary', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Primary.${theme}.png`) - }) - - test.fixme('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--primary', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Small', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--small', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Small.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--small', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Trailing Action', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--trailing-action', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Trailing Action.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--trailing-action', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Trailing Counter', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--trailing-counter', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Trailing Counter.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--trailing-counter', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Trailing Visual', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--trailing-visual', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Trailing Visual.${theme}.png`) - }) - - test('axe @aat', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-features--trailing-visual', - globals: { - colorScheme: theme, - }, - }) - await expect(page).toHaveNoViolations({ - rules: { - 'color-contrast': { - enabled: theme !== 'dark_dimmed', - }, - }, - }) - }) - }) - } - }) - - test.describe('Dev: Invisible Variants', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-devonly--invisible-variants', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.Invisible Variants.${theme}.png`) - }) - }) - } - }) - - test.describe('Dev: sx prop', () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'drafts-components-button-devonly--test-sx-prop', - globals: { - colorScheme: theme, - }, - }) - - // Default state - expect(await page.screenshot()).toMatchSnapshot(`Button.sx prop.${theme}.png`) - }) - }) - } - }) -}) diff --git a/examples/nextjs/package-lock.json b/examples/nextjs/package-lock.json index 4f10bcc933f..babb03f1f4c 100644 --- a/examples/nextjs/package-lock.json +++ b/examples/nextjs/package-lock.json @@ -52,15 +52,15 @@ "styled-system": "^5.1.5" }, "devDependencies": { - "@actions/core": "1.10.0", + "@actions/core": "1.10.1", "@babel/cli": "7.22.10", "@babel/core": "7.22.5", - "@babel/eslint-parser": "7.22.15", - "@babel/parser": "7.22.16", + "@babel/eslint-parser": "7.23.3", + "@babel/parser": "7.23.0", "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6", "@babel/plugin-proposal-optional-chaining": "7.21.0", "@babel/plugin-transform-modules-commonjs": "7.22.15", - "@babel/preset-react": "7.22.15", + "@babel/preset-react": "7.23.3", "@babel/preset-typescript": "7.22.15", "@changesets/changelog-github": "0.4.8", "@changesets/cli": "2.26.2", @@ -132,14 +132,14 @@ "eslint-plugin-mdx": "2.2.0", "eslint-plugin-playwright": "0.15.1", "eslint-plugin-prettier": "5.0.0", - "eslint-plugin-primer-react": "4.0.1", + "eslint-plugin-primer-react": "4.0.2", "eslint-plugin-react": "7.32.2", "eslint-plugin-react-hooks": "4.6.0", "eslint-plugin-ssr-friendly": "1.2.0", "eslint-plugin-storybook": "0.6.13", "eslint-plugin-testing-library": "6.0.2", "fast-glob": "3.3.1", - "filesize": "10.0.12", + "filesize": "10.1.0", "front-matter": "4.0.2", "gzip-size": "6.0.0", "husky": "8.0.3", @@ -158,7 +158,7 @@ "markdownlint-cli2": "^0.10.0", "markdownlint-cli2-formatter-pretty": "0.0.3", "mdast-util-from-markdown": "2.0.0", - "mdast-util-frontmatter": "1.0.1", + "mdast-util-frontmatter": "2.0.1", "mdast-util-mdx": "3.0.0", "mdast-util-to-string": "4.0.0", "micromark-extension-frontmatter": "2.0.0", @@ -184,7 +184,7 @@ "terser": "5.17.6", "ts-node": "10.9.1", "ts-toolbelt": "9.6.0", - "typescript": "4.9.5", + "typescript": "5.2.2", "typescript-plugin-css-modules": "5.0.1", "unist-util-find": "3.0.0", "unist-util-find-before": "4.0.0", @@ -35704,30 +35704,30 @@ } }, "node_modules/@babel/compat-data": { - "version": "7.23.2", - "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.2.tgz", - "integrity": "sha512-0S9TQMmDHlqAZ2ITT95irXKfxN9bncq8ZCoJhun3nHL/lLUxd2NKBJYoNGWH7S0hz6fRQwWlAWn/ILM0C70KZQ==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.3.tgz", + "integrity": "sha512-BmR4bWbDIoFJmJ9z2cZ8Gmm2MXgEDgjdWgpKmKWUt54UGFJdlj31ECtbaDvCG/qVdG3AQ1SfpZEs01lUFbzLOQ==", "peer": true, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/core": { - "version": "7.23.2", - "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.2.tgz", - "integrity": "sha512-n7s51eWdaWZ3vGT2tD4T7J6eJs3QoBXydv7vkUM06Bf1cbVD2Kc2UrkzhiQwobfV7NwOnQXYL7UBJ5VPU+RGoQ==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.3.tgz", + "integrity": "sha512-Jg+msLuNuCJDyBvFv5+OKOUjWMZgd85bKjbICd3zWrKAo+bJ49HJufi7CQE0q0uR8NGyO6xkCACScNqyjHSZew==", "peer": true, "dependencies": { "@ampproject/remapping": "^2.2.0", "@babel/code-frame": "^7.22.13", - "@babel/generator": "^7.23.0", + "@babel/generator": "^7.23.3", "@babel/helper-compilation-targets": "^7.22.15", - "@babel/helper-module-transforms": "^7.23.0", + "@babel/helper-module-transforms": "^7.23.3", "@babel/helpers": "^7.23.2", - "@babel/parser": "^7.23.0", + "@babel/parser": "^7.23.3", "@babel/template": "^7.22.15", - "@babel/traverse": "^7.23.2", - "@babel/types": "^7.23.0", + "@babel/traverse": "^7.23.3", + "@babel/types": "^7.23.3", "convert-source-map": "^2.0.0", "debug": "^4.1.0", "gensync": "^1.0.0-beta.2", @@ -35743,11 +35743,11 @@ } }, "node_modules/@babel/generator": { - "version": "7.23.0", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.0.tgz", - "integrity": "sha512-lN85QRR+5IbYrMWM6Y4pE/noaQtg4pNiqeNGX60eqOfo6gtEj6uw/JagelB8vVztSd7R6M5n1+PQkDbHbBRU4g==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.3.tgz", + "integrity": "sha512-keeZWAV4LU3tW0qRi19HRpabC/ilM0HRBBzf9/k8FFiG4KVpiv0FIy4hHfLfFQZNhziCTPTmd59zoyv6DNISzg==", "dependencies": { - "@babel/types": "^7.23.0", + "@babel/types": "^7.23.3", "@jridgewell/gen-mapping": "^0.3.2", "@jridgewell/trace-mapping": "^0.3.17", "jsesc": "^2.5.1" @@ -35823,9 +35823,9 @@ } }, "node_modules/@babel/helper-module-transforms": { - "version": "7.23.0", - "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.0.tgz", - "integrity": "sha512-WhDWw1tdrlT0gMgUJSlX0IQvoO1eN279zrAUbVB+KpV2c3Tylz8+GnKOLllCS6Z/iZQEyVYxhZVUdPTqs2YYPw==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.3.tgz", + "integrity": "sha512-7bBs4ED9OmswdfDzpz4MpWgSrV7FXlc3zIagvLFjS5H+Mk7Snr21vQ6QwrsoCGMfNC4e4LQPdoULEt4ykz0SRQ==", "peer": true, "dependencies": { "@babel/helper-environment-visitor": "^7.22.20", @@ -35921,9 +35921,9 @@ } }, "node_modules/@babel/parser": { - "version": "7.23.0", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.0.tgz", - "integrity": "sha512-vvPKKdMemU85V9WE/l5wZEmImpCtLqbnTvqDS2U1fJ96KrxoW7KrXhNsNCblQlg8Ck4b85yxdTyelsMUgFUXiw==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.3.tgz", + "integrity": "sha512-uVsWNvlVsIninV2prNz/3lHCb+5CJ+e+IUBfbjToAHODtfGYLfCFuY4AU7TskI+dAKk+njsPiBjq1gKTvZOBaw==", "bin": { "parser": "bin/babel-parser.js" }, @@ -35957,18 +35957,18 @@ } }, "node_modules/@babel/traverse": { - "version": "7.23.2", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.2.tgz", - "integrity": "sha512-azpe59SQ48qG6nu2CzcMLbxUudtN+dOM9kDbUqGq3HXUJRlo7i8fvPoxQUzYgLZ4cMVmuZgm8vvBpNeRhd6XSw==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.3.tgz", + "integrity": "sha512-+K0yF1/9yR0oHdE0StHuEj3uTPzwwbrLGfNOndVJVV2TqA5+j3oljJUb4nmB954FLGjNem976+B+eDuLIjesiQ==", "dependencies": { "@babel/code-frame": "^7.22.13", - "@babel/generator": "^7.23.0", + "@babel/generator": "^7.23.3", "@babel/helper-environment-visitor": "^7.22.20", "@babel/helper-function-name": "^7.23.0", "@babel/helper-hoist-variables": "^7.22.5", "@babel/helper-split-export-declaration": "^7.22.6", - "@babel/parser": "^7.23.0", - "@babel/types": "^7.23.0", + "@babel/parser": "^7.23.3", + "@babel/types": "^7.23.3", "debug": "^4.1.0", "globals": "^11.1.0" }, @@ -35977,9 +35977,9 @@ } }, "node_modules/@babel/types": { - "version": "7.23.0", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.0.tgz", - "integrity": "sha512-0oIyUfKoI3mSqMvsxBdclDwxXKXAUA8v/apZbc+iSyARYou1o8ZGDxbUYyLFoW2arqS2jDGqJuZvv1d/io1axg==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.3.tgz", + "integrity": "sha512-OZnvoH2l8PK5eUvEcUyCt/sXgr/h+UWpVuBbOljwcrAgUl6lpchoQ++PHGyQy1AtYnVA6CEq3y5xeEI10brpXw==", "dependencies": { "@babel/helper-string-parser": "^7.22.5", "@babel/helper-validator-identifier": "^7.22.20", @@ -36364,9 +36364,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.4.569", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.569.tgz", - "integrity": "sha512-LsrJjZ0IbVy12ApW3gpYpcmHS3iRxH4bkKOW98y1/D+3cvDUWGcbzbsFinfUS8knpcZk/PG/2p/RnkMCYN7PVg==", + "version": "1.4.582", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.582.tgz", + "integrity": "sha512-89o0MGoocwYbzqUUjc+VNpeOFSOK9nIdC5wY4N+PVUarUK0MtjyTjks75AZS2bW4Kl8MdewdFsWaH0jLy+JNoA==", "peer": true }, "node_modules/escalade": { diff --git a/package-lock.json b/package-lock.json index 565223915e7..f690e86a6eb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@primer/react", - "version": "36.2.0", + "version": "36.3.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@primer/react", - "version": "36.2.0", + "version": "36.3.1", "license": "MIT", "dependencies": { "@github/combobox-nav": "^2.1.5", @@ -15,10 +15,9 @@ "@github/relative-time-element": "^4.1.2", "@lit-labs/react": "^1.1.1", "@oddbird/popover-polyfill": "^0.3.1", - "@primer/behaviors": "1.5.1", + "@primer/behaviors": "^1.5.1", "@primer/octicons-react": "^19.8.0", "@primer/primitives": "^7.11.11", - "@react-aria/ssr": "^3.5.0", "@styled-system/css": "^5.1.5", "@styled-system/props": "^5.1.5", "@styled-system/theme-get": "^5.1.2", @@ -47,7 +46,7 @@ "@babel/parser": "7.23.0", "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6", "@babel/plugin-proposal-optional-chaining": "7.21.0", - "@babel/plugin-transform-modules-commonjs": "7.22.15", + "@babel/plugin-transform-modules-commonjs": "7.23.3", "@babel/preset-react": "7.23.3", "@babel/preset-typescript": "7.22.15", "@changesets/changelog-github": "0.4.8", @@ -62,8 +61,8 @@ "@rollup/plugin-node-resolve": "15.1.0", "@rollup/plugin-replace": "5.0.2", "@rollup/plugin-terser": "0.4.3", - "@rollup/plugin-typescript": "11.1.0", - "@rollup/plugin-virtual": "3.0.1", + "@rollup/plugin-typescript": "11.1.5", + "@rollup/plugin-virtual": "3.0.2", "@size-limit/preset-big-lib": "8.2.6", "@storybook/addon-a11y": "7.1.0", "@storybook/addon-actions": "7.1.0", @@ -87,10 +86,10 @@ "@types/jest": "29.5.6", "@types/jest-axe": "3.5.5", "@types/lodash.groupby": "4.6.7", - "@types/lodash.isempty": "4.4.7", + "@types/lodash.isempty": "4.4.9", "@types/lodash.isobject": "3.0.7", "@types/lodash.keyby": "4.6.7", - "@types/node": "18.16.19", + "@types/node": "20.10.3", "@types/react": "18.2.21", "@types/react-dom": "18.2.6", "@types/semver": "7.5.3", @@ -150,9 +149,9 @@ "mdast-util-mdx": "3.0.0", "mdast-util-to-string": "4.0.0", "micromark-extension-frontmatter": "2.0.0", - "micromark-extension-mdxjs": "2.0.0", + "micromark-extension-mdxjs": "3.0.0", "postcss-custom-properties-fallback": "1.0.2", - "postcss-preset-env": "9.2.0", + "postcss-preset-env": "9.3.0", "prettier": "3.0.3", "react": "18.2.0", "react-dnd": "14.0.4", @@ -173,7 +172,7 @@ "ts-node": "10.9.1", "ts-toolbelt": "9.6.0", "typescript": "5.2.2", - "typescript-plugin-css-modules": "5.0.1", + "typescript-plugin-css-modules": "5.0.2", "unist-util-find": "3.0.0", "unist-util-find-before": "4.0.0", "unist-util-flat-filter": "2.0.0", @@ -224,9 +223,9 @@ } }, "node_modules/@adobe/css-tools": { - "version": "4.3.1", - "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.3.1.tgz", - "integrity": "sha512-/62yikz7NLScCGAAST5SHdnjaDJQBDq0M2muyRTpf2VQhw6StBg2ALiu73zSJQ4fMVLA+0uBhBHAle7Wg+2kSg==", + "version": "4.3.2", + "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.3.2.tgz", + "integrity": "sha512-DA5a1C0gD/pLOvhv33YMrbf2FK3oUzwNl9oOJqE4XVjuEtt6XIakRcsd7eLiOSPkp1kTRQGICTA8cKra/vFbjw==", "dev": true }, "node_modules/@ampproject/remapping": { @@ -599,9 +598,9 @@ } }, "node_modules/@babel/helper-module-transforms": { - "version": "7.22.20", - "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.22.20.tgz", - "integrity": "sha512-dLT7JVWIUUxKOs1UnJUBR3S70YK+pKX6AbJgB2vMIvEkZkrfJDbYDJesnPshtKV4LhDOR3Oc5YULeDizRek+5A==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.3.tgz", + "integrity": "sha512-7bBs4ED9OmswdfDzpz4MpWgSrV7FXlc3zIagvLFjS5H+Mk7Snr21vQ6QwrsoCGMfNC4e4LQPdoULEt4ykz0SRQ==", "dev": true, "dependencies": { "@babel/helper-environment-visitor": "^7.22.20", @@ -1563,12 +1562,12 @@ } }, "node_modules/@babel/plugin-transform-modules-commonjs": { - "version": "7.22.15", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.22.15.tgz", - "integrity": "sha512-jWL4eh90w0HQOTKP2MoXXUpVxilxsB2Vl4ji69rSjS3EcZ/v4sBmn+A3NpepuJzBhOaEBbR7udonlHHn5DWidg==", + "version": "7.23.3", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.23.3.tgz", + "integrity": "sha512-aVS0F65LKsdNOtcz6FRCpE4OgsP2OFnW46qNxNIX9h3wuzaNcSQsJysuMwqSibC98HPrf2vCgtxKNwS0DAlgcA==", "dev": true, "dependencies": { - "@babel/helper-module-transforms": "^7.22.15", + "@babel/helper-module-transforms": "^7.23.3", "@babel/helper-plugin-utils": "^7.22.5", "@babel/helper-simple-access": "^7.22.5" }, @@ -2801,9 +2800,9 @@ } }, "node_modules/@csstools/postcss-cascade-layers": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/@csstools/postcss-cascade-layers/-/postcss-cascade-layers-4.0.0.tgz", - "integrity": "sha512-dVPVVqQG0FixjM9CG/+8eHTsCAxRKqmNh6H69IpruolPlnEF1611f2AoLK8TijTSAsqBSclKd4WHs1KUb/LdJw==", + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/@csstools/postcss-cascade-layers/-/postcss-cascade-layers-4.0.1.tgz", + "integrity": "sha512-UYFuFL9GgVnftg9v7tBvVEBRLaBeAD66euD+yYy5fYCUld9ZIWTJNCE30hm6STMEdt6FL5xzeVw1lAZ1tpvUEg==", "dev": true, "funding": [ { @@ -3112,6 +3111,50 @@ "postcss": "^8.4" } }, + "node_modules/@csstools/postcss-logical-overflow": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@csstools/postcss-logical-overflow/-/postcss-logical-overflow-1.0.0.tgz", + "integrity": "sha512-cIrZ8f7bGGvr+W53nEuMspcwaeaI2YTmz6LZ4yiAO5z14/PQgOOv+Pn+qjvPOPoadeY2BmpaoTzZKvdAQuM17w==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": "^14 || ^16 || >=18" + }, + "peerDependencies": { + "postcss": "^8.4" + } + }, + "node_modules/@csstools/postcss-logical-overscroll-behavior": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@csstools/postcss-logical-overscroll-behavior/-/postcss-logical-overscroll-behavior-1.0.0.tgz", + "integrity": "sha512-e89S2LWjnxf0SB2wNUAbqDyFb/Fow/tlOe1XqOLbNx4rf3LrQokM9qldVx7sarnddml3ORE5LDUmlKpPOOeJTA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": "^14 || ^16 || >=18" + }, + "peerDependencies": { + "postcss": "^8.4" + } + }, "node_modules/@csstools/postcss-logical-resize": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@csstools/postcss-logical-resize/-/postcss-logical-resize-2.0.0.tgz", @@ -3747,9 +3790,9 @@ } }, "node_modules/@github/auto-complete-element": { - "version": "3.5.1", - "resolved": "https://registry.npmjs.org/@github/auto-complete-element/-/auto-complete-element-3.5.1.tgz", - "integrity": "sha512-7/g6Nz6Zz4/k0m/L0n+OEO29WZcXgXwLJn7Ql02UbIMR2ClFEZIwIvvzb+3fEECOyLpFrZC/JH7Svz9RYPc+wA==", + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/@github/auto-complete-element/-/auto-complete-element-3.6.0.tgz", + "integrity": "sha512-u8fG8nCosSFv2wlKMsGga+FaFu/jkexZVFIDxLiCyLVTB8zRRu/RJyufzNnmbOZHYBezCMNBgJ0quuEBoyRh9Q==", "dev": true, "dependencies": { "@github/combobox-nav": "^2.1.7" @@ -3768,9 +3811,9 @@ "dev": true }, "node_modules/@github/clipboard-copy-element": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@github/clipboard-copy-element/-/clipboard-copy-element-1.2.1.tgz", - "integrity": "sha512-PLccyUCnzmOQ6zrRsH66rr67iumJyP5r7ij17ezprFQAK/oA8CXhlC8LTG+xpW3cYAvnp2zCgRNTfXS8wk09Lg==", + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@github/clipboard-copy-element/-/clipboard-copy-element-1.3.0.tgz", + "integrity": "sha512-wyntkQkwoLbLo+Hqg2LIVMXDIzcvUb9bSDz+clX6nVJItwzh103rHxdXFRZD+DmxVbuEW5xSznYQXkz1jZT+xg==", "dev": true }, "node_modules/@github/combobox-nav": { @@ -5830,9 +5873,9 @@ } }, "node_modules/@oddbird/popover-polyfill": { - "version": "0.3.1", - "resolved": "https://registry.npmjs.org/@oddbird/popover-polyfill/-/popover-polyfill-0.3.1.tgz", - "integrity": "sha512-Ne0e4L0Yo++NyNVpsrY+u1fK9xlBjwDqOj+neQQpaa4zsXhDDj/OSHuODhgbHI6YrwhA4XvgWMiFuhkBOAo1Bw==" + "version": "0.3.6", + "resolved": "https://registry.npmjs.org/@oddbird/popover-polyfill/-/popover-polyfill-0.3.6.tgz", + "integrity": "sha512-9y9vWw6svuva+pLahuK1CBScoXhk70yiS9l+Ll7IBsUC3gTmdHDGXBv+H0EwGsJ3iCytvTd98Ds3+fcQQABrPg==" }, "node_modules/@pkgjs/parseargs": { "version": "0.11.0", @@ -5963,13 +6006,13 @@ "integrity": "sha512-ApPbNhiWPHscs0+rLV76sCY75IEpPvDEZq9+iQXQqU6Tv5SLdax3PmzJlUHftlQ7O/eJnLO1dTEMEwj2Yn1BLA==" }, "node_modules/@primer/css": { - "version": "21.0.9", - "resolved": "https://registry.npmjs.org/@primer/css/-/css-21.0.9.tgz", - "integrity": "sha512-kk0TfLqtGwGYJ/qXGLMXDIL4d3qWPjlEB12Hvk08krulbsQRWEsnXjejBIvJG69GyOOuYxXNoHvP2NGenxQ8Jw==", + "version": "21.1.0", + "resolved": "https://registry.npmjs.org/@primer/css/-/css-21.1.0.tgz", + "integrity": "sha512-2MgVTgH3uWcN665JlwIasjjbB8pRLS+hMFyjFlesn5mUUseCS33aVRP8R6uIn5nk1A9IN+nq8MAGco3OAhlGZg==", "dev": true, "dependencies": { "@primer/primitives": "^7.12.0", - "@primer/view-components": "^0.5.1" + "@primer/view-components": "^0.14.0" }, "engines": { "node": ">=16.0.0" @@ -5987,35 +6030,29 @@ } }, "node_modules/@primer/primitives": { - "version": "7.13.0", - "resolved": "https://registry.npmjs.org/@primer/primitives/-/primitives-7.13.0.tgz", - "integrity": "sha512-pO1o0rdgatVOcUosuiQIni0ur7qLS954QjwmnIz1cXWxZhVLbhjK4eY/DUL2zmvbohLTXTE+6dC6ksLafckPvg==" + "version": "7.15.4", + "resolved": "https://registry.npmjs.org/@primer/primitives/-/primitives-7.15.4.tgz", + "integrity": "sha512-471hL6pkcGuPS4G0urQ0TRZYo3ukAaVhUtvlsi1mZLofmX+EF+9iQL/iau06JfaQkm5NNP236+F7yyxXra9EjA==" }, "node_modules/@primer/view-components": { - "version": "0.5.1", - "resolved": "https://registry.npmjs.org/@primer/view-components/-/view-components-0.5.1.tgz", - "integrity": "sha512-TI51R4rVobwK6sWRhu7HRHC6yxud2I9P1sYN6o/fHhIq7QU31mJyv1PtD8nfhmOqN/SsRC6q3pnCbh5Qt1wD/g==", + "version": "0.14.0", + "resolved": "https://registry.npmjs.org/@primer/view-components/-/view-components-0.14.0.tgz", + "integrity": "sha512-q5kctH/ujpVYYljZGWjmwZXU7s1VT70TEE6+JeIAgtohkIIMFKdlHsrzmrQ+4AwDW01Pi3maHLiIcDy3HTe1JA==", "dev": true, "dependencies": { "@github/auto-check-element": "^5.2.0", "@github/auto-complete-element": "^3.3.4", "@github/catalyst": "^1.6.0", - "@github/clipboard-copy-element": "^1.1.2", + "@github/clipboard-copy-element": "^1.3.0", "@github/details-menu-element": "^1.0.12", "@github/image-crop-element": "^5.0.0", "@github/include-fragment-element": "^6.1.1", "@github/relative-time-element": "^4.0.0", "@github/tab-container-element": "^3.1.2", - "@oddbird/popover-polyfill": "^0.2.1", + "@oddbird/popover-polyfill": "^0.3.2", "@primer/behaviors": "^1.3.4" } }, - "node_modules/@primer/view-components/node_modules/@oddbird/popover-polyfill": { - "version": "0.2.3", - "resolved": "https://registry.npmjs.org/@oddbird/popover-polyfill/-/popover-polyfill-0.2.3.tgz", - "integrity": "sha512-XDK+V/gUeE4NEsWp79eVzhlK3wuVcRDJuaas63qo0IJLJpyOLHqycJLFYvuq8kebgT1nl87P3sbSb5ZN6Vyf5g==", - "dev": true - }, "node_modules/@radix-ui/number": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@radix-ui/number/-/number-1.0.1.tgz", @@ -6679,17 +6716,6 @@ "@babel/runtime": "^7.13.10" } }, - "node_modules/@react-aria/ssr": { - "version": "3.5.0", - "resolved": "https://registry.npmjs.org/@react-aria/ssr/-/ssr-3.5.0.tgz", - "integrity": "sha512-h0MJdSWOd1qObLnJ8mprU31wI8tmKFJMuwT22MpWq6psisOOZaga6Ml4u6Ee6M6duWWISjXvqO4Sb/J0PBA+nQ==", - "dependencies": { - "@swc/helpers": "^0.4.14" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0" - } - }, "node_modules/@react-dnd/asap": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/@react-dnd/asap/-/asap-4.0.0.tgz", @@ -6868,9 +6894,9 @@ } }, "node_modules/@rollup/plugin-typescript": { - "version": "11.1.0", - "resolved": "https://registry.npmjs.org/@rollup/plugin-typescript/-/plugin-typescript-11.1.0.tgz", - "integrity": "sha512-86flrfE+bSHB69znnTV6kVjkncs2LBMhcTCyxWgRxLyfXfQrxg4UwlAqENnjrrxnSNS/XKCDJCl8EkdFJVHOxw==", + "version": "11.1.5", + "resolved": "https://registry.npmjs.org/@rollup/plugin-typescript/-/plugin-typescript-11.1.5.tgz", + "integrity": "sha512-rnMHrGBB0IUEv69Q8/JGRD/n4/n6b3nfpufUu26axhUcboUzv/twfZU8fIBbTOphRAe0v8EyxzeDpKXqGHfyDA==", "dev": true, "dependencies": { "@rollup/pluginutils": "^5.0.1", @@ -6880,7 +6906,7 @@ "node": ">=14.0.0" }, "peerDependencies": { - "rollup": "^2.14.0||^3.0.0", + "rollup": "^2.14.0||^3.0.0||^4.0.0", "tslib": "*", "typescript": ">=3.7.0" }, @@ -6894,15 +6920,15 @@ } }, "node_modules/@rollup/plugin-virtual": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/@rollup/plugin-virtual/-/plugin-virtual-3.0.1.tgz", - "integrity": "sha512-fK8O0IL5+q+GrsMLuACVNk2x21g3yaw+sG2qn16SnUd3IlBsQyvWxLMGHmCmXRMecPjGRSZ/1LmZB4rjQm68og==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@rollup/plugin-virtual/-/plugin-virtual-3.0.2.tgz", + "integrity": "sha512-10monEYsBp3scM4/ND4LNH5Rxvh3e/cVeL3jWTgZ2SrQ+BmUoQcopVQvnaMcOnykb1VkxUFuDAN+0FnpTFRy2A==", "dev": true, "engines": { "node": ">=14.0.0" }, "peerDependencies": { - "rollup": "^1.20.0||^2.0.0||^3.0.0" + "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0" }, "peerDependenciesMeta": { "rollup": { @@ -13196,14 +13222,6 @@ "node": ">=10" } }, - "node_modules/@swc/helpers": { - "version": "0.4.14", - "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.4.14.tgz", - "integrity": "sha512-4C7nX/dvpzB7za4Ql9K81xK3HPxCpHMgwTZVyf+9JQ6VUbn9jjZVN7/Nkdz/Ugzs2CSjqnL/UPXroiVBVHUWUw==", - "dependencies": { - "tslib": "^2.4.0" - } - }, "node_modules/@testing-library/dom": { "version": "9.3.1", "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.3.1.tgz", @@ -13896,9 +13914,9 @@ } }, "node_modules/@types/lodash.isempty": { - "version": "4.4.7", - "resolved": "https://registry.npmjs.org/@types/lodash.isempty/-/lodash.isempty-4.4.7.tgz", - "integrity": "sha512-YOzlpoIn9jrfHzjIukKnu9Le3tmi+0PhUdOt2rMpJW/4J6jX7s0HeBatXdh9QckLga8qt4EKBxVIEqtEq6pzLg==", + "version": "4.4.9", + "resolved": "https://registry.npmjs.org/@types/lodash.isempty/-/lodash.isempty-4.4.9.tgz", + "integrity": "sha512-DPSFfnT2JmZiAWNWOU8IRZws/Ha6zyGF5m06TydfsY+0dVoQqby2J61Na2QU4YtwiZ+moC6cJS6zWYBJq4wBVw==", "dev": true, "dependencies": { "@types/lodash": "*" @@ -13960,10 +13978,13 @@ "integrity": "sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA==" }, "node_modules/@types/node": { - "version": "18.16.19", - "resolved": "https://registry.npmjs.org/@types/node/-/node-18.16.19.tgz", - "integrity": "sha512-IXl7o+R9iti9eBW4Wg2hx1xQDig183jj7YLn8F7udNceyfkbn1ZxmzZXuak20gR40D7pIkIY1kYGx5VIGbaHKA==", - "dev": true + "version": "20.10.3", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.10.3.tgz", + "integrity": "sha512-XJavIpZqiXID5Yxnxv3RUDKTN5b81ddNC3ecsA0SoFXz/QU8OGBwZGMomiq0zw+uuqbL/krztv/DINAQ/EV4gg==", + "dev": true, + "dependencies": { + "undici-types": "~5.26.4" + } }, "node_modules/@types/node-fetch": { "version": "2.6.4", @@ -18032,9 +18053,9 @@ "dev": true }, "node_modules/cssdb": { - "version": "7.8.0", - "resolved": "https://registry.npmjs.org/cssdb/-/cssdb-7.8.0.tgz", - "integrity": "sha512-SkeezZOQr5AHt9MgJgSFNyiuJwg1p8AwoVln6JwaQJsyxduRW9QJ+HP/gAQzbsz8SIqINtYvpJKjxTRI67zxLg==", + "version": "7.9.0", + "resolved": "https://registry.npmjs.org/cssdb/-/cssdb-7.9.0.tgz", + "integrity": "sha512-WPMT9seTQq6fPAa1yN4zjgZZeoTriSN2LqW9C+otjar12DQIWA4LuSfFrvFJiKp4oD0xIk1vumDLw8K9ur4NBw==", "dev": true, "funding": [ { @@ -31470,9 +31491,9 @@ ] }, "node_modules/micromark-extension-mdx-expression": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/micromark-extension-mdx-expression/-/micromark-extension-mdx-expression-2.0.0.tgz", - "integrity": "sha512-hUI6PJCCVaymBF5paL29sOpcbtVXtumDdJgBDxN+tbHlXAqQwNl4EhhJfx4fe7bUpEZzcFRIBAeOiGq7hsZBXw==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/micromark-extension-mdx-expression/-/micromark-extension-mdx-expression-3.0.0.tgz", + "integrity": "sha512-sI0nwhUDz97xyzqJAbHQhp5TfaxEvZZZ2JDqUo+7NvyIYG6BZ5CPPqj2ogUoPJlmXHBnyZUzISg9+oUmU6tUjQ==", "dev": true, "funding": [ { @@ -31568,15 +31589,15 @@ ] }, "node_modules/micromark-extension-mdx-jsx": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/micromark-extension-mdx-jsx/-/micromark-extension-mdx-jsx-2.0.0.tgz", - "integrity": "sha512-hp6ff4eympWcq3Jh9XIJmJPNpM2RNmBjz5vvU1YkND7h4UwjSZas7lXSrAJjtTG7Z56JMMTyowwcbPkAjZmwMg==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/micromark-extension-mdx-jsx/-/micromark-extension-mdx-jsx-3.0.0.tgz", + "integrity": "sha512-uvhhss8OGuzR4/N17L1JwvmJIpPhAd8oByMawEKx6NVdBCbesjH4t+vjEp3ZXft9DwvlKSD07fCeI44/N0Vf2w==", "dev": true, "dependencies": { "@types/acorn": "^4.0.0", "@types/estree": "^1.0.0", "devlop": "^1.0.0", - "estree-util-is-identifier-name": "^2.0.0", + "estree-util-is-identifier-name": "^3.0.0", "micromark-factory-mdx-expression": "^2.0.0", "micromark-factory-space": "^2.0.0", "micromark-util-character": "^2.0.0", @@ -31590,11 +31611,21 @@ } }, "node_modules/micromark-extension-mdx-jsx/node_modules/@types/unist": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.0.tgz", - "integrity": "sha512-MFETx3tbTjE7Uk6vvnWINA/1iJ7LuMdO4fcq8UfF0pRbj01aGLduVvQcRyswuACJdpnHgg8E3rQLhaRdNEJS0w==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz", + "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==", "dev": true }, + "node_modules/micromark-extension-mdx-jsx/node_modules/estree-util-is-identifier-name": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/estree-util-is-identifier-name/-/estree-util-is-identifier-name-3.0.0.tgz", + "integrity": "sha512-hFtqIDZTIUZ9BXLb8y4pYGyk6+wekIivNVTcmvk8NoOh+VeRn5y6cEHzbURrWbfp1fIqdVipilzj+lfaadNZmg==", + "dev": true, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/micromark-extension-mdx-jsx/node_modules/micromark-factory-space": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/micromark-factory-space/-/micromark-factory-space-2.0.0.tgz", @@ -31724,17 +31755,17 @@ ] }, "node_modules/micromark-extension-mdxjs": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/micromark-extension-mdxjs/-/micromark-extension-mdxjs-2.0.0.tgz", - "integrity": "sha512-cICbQUdcgFvfg3JH9XTqZoa1ONCZI0GsiOvl9672Ka3SilIo9kMmaKLdSd/QrDgNGxrirWtZfFh19DSKJUivWQ==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/micromark-extension-mdxjs/-/micromark-extension-mdxjs-3.0.0.tgz", + "integrity": "sha512-A873fJfhnJ2siZyUrJ31l34Uqwy4xIFmvPY1oj+Ean5PHcPBYzEsvqvWGaWcfEIr11O5Dlw3p2y0tZWpKHDejQ==", "dev": true, "dependencies": { "acorn": "^8.0.0", "acorn-jsx": "^5.0.0", - "micromark-extension-mdx-expression": "^2.0.0", - "micromark-extension-mdx-jsx": "^2.0.0", + "micromark-extension-mdx-expression": "^3.0.0", + "micromark-extension-mdx-jsx": "^3.0.0", "micromark-extension-mdx-md": "^2.0.0", - "micromark-extension-mdxjs-esm": "^2.0.0", + "micromark-extension-mdxjs-esm": "^3.0.0", "micromark-util-combine-extensions": "^2.0.0", "micromark-util-types": "^2.0.0" }, @@ -31744,9 +31775,9 @@ } }, "node_modules/micromark-extension-mdxjs-esm": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/micromark-extension-mdxjs-esm/-/micromark-extension-mdxjs-esm-2.0.1.tgz", - "integrity": "sha512-HLPrY5XLYzFtG5KxEcZXfUV/SOy9Eu3R+dnpP1P6ko/ZO9xceGxmgJOAMq4r/rPLrHaEosfhNIOXDcvFSkVfKQ==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/micromark-extension-mdxjs-esm/-/micromark-extension-mdxjs-esm-3.0.0.tgz", + "integrity": "sha512-DJFl4ZqkErRpq/dAPyeWp15tGrcrrJho1hKK5uBS70BCtfrIFg81sqcTVu3Ta+KD1Tk5vAtBNElWxtAa+m8K9A==", "dev": true, "dependencies": { "@types/estree": "^1.0.0", @@ -31765,9 +31796,9 @@ } }, "node_modules/micromark-extension-mdxjs-esm/node_modules/@types/unist": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.0.tgz", - "integrity": "sha512-MFETx3tbTjE7Uk6vvnWINA/1iJ7LuMdO4fcq8UfF0pRbj01aGLduVvQcRyswuACJdpnHgg8E3rQLhaRdNEJS0w==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz", + "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==", "dev": true }, "node_modules/micromark-extension-mdxjs-esm/node_modules/micromark-core-commonmark": { @@ -32257,9 +32288,9 @@ } }, "node_modules/micromark-factory-mdx-expression/node_modules/@types/unist": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.0.tgz", - "integrity": "sha512-MFETx3tbTjE7Uk6vvnWINA/1iJ7LuMdO4fcq8UfF0pRbj01aGLduVvQcRyswuACJdpnHgg8E3rQLhaRdNEJS0w==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz", + "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==", "dev": true }, "node_modules/micromark-factory-mdx-expression/node_modules/micromark-util-character": { @@ -32534,9 +32565,9 @@ ] }, "node_modules/micromark-util-events-to-acorn": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/micromark-util-events-to-acorn/-/micromark-util-events-to-acorn-2.0.1.tgz", - "integrity": "sha512-3pf0pxvFaTxzTwisMHmEk5lnW7oSU/oRZxpZcrdx/voJgCpPaspexc89mJodW4ekATo1UILtZvjESclKONSB6w==", + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/micromark-util-events-to-acorn/-/micromark-util-events-to-acorn-2.0.2.tgz", + "integrity": "sha512-Fk+xmBrOv9QZnEDguL9OI9/NQQp6Hz4FuQ4YmCb/5V7+9eAh1s6AYSvL20kHkD67YIg7EpE54TiSlcsf3vyZgA==", "dev": true, "funding": [ { @@ -32553,18 +32584,32 @@ "@types/estree": "^1.0.0", "@types/unist": "^3.0.0", "devlop": "^1.0.0", - "estree-util-visit": "^1.0.0", + "estree-util-visit": "^2.0.0", "micromark-util-symbol": "^2.0.0", "micromark-util-types": "^2.0.0", "vfile-message": "^4.0.0" } }, "node_modules/micromark-util-events-to-acorn/node_modules/@types/unist": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.0.tgz", - "integrity": "sha512-MFETx3tbTjE7Uk6vvnWINA/1iJ7LuMdO4fcq8UfF0pRbj01aGLduVvQcRyswuACJdpnHgg8E3rQLhaRdNEJS0w==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz", + "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==", "dev": true }, + "node_modules/micromark-util-events-to-acorn/node_modules/estree-util-visit": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/estree-util-visit/-/estree-util-visit-2.0.0.tgz", + "integrity": "sha512-m5KgiH85xAhhW8Wta0vShLcUvOsh3LLPI2YVwcbio1l7E09NTLL1EyMZFM1OyWowoH0skScNbhOPl4kcBgzTww==", + "dev": true, + "dependencies": { + "@types/estree-jsx": "^1.0.0", + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/micromark-util-events-to-acorn/node_modules/micromark-util-symbol": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/micromark-util-symbol/-/micromark-util-symbol-2.0.0.tgz", @@ -35542,9 +35587,9 @@ } }, "node_modules/postcss-preset-env": { - "version": "9.2.0", - "resolved": "https://registry.npmjs.org/postcss-preset-env/-/postcss-preset-env-9.2.0.tgz", - "integrity": "sha512-Lnr4C5gb7t5Cc8akQMJzNdJkqw7s7s7BHUaQSgsuf+CTY9Lsz5lqQTft5yNZr59JyCLz0aFNSAqSLm/xRtcTpg==", + "version": "9.3.0", + "resolved": "https://registry.npmjs.org/postcss-preset-env/-/postcss-preset-env-9.3.0.tgz", + "integrity": "sha512-ycw6doPrqV6QxDCtgiyGDef61bEfiSc59HGM4gOw/wxQxmKnhuEery61oOC/5ViENz/ycpRsuhTexs1kUBTvVw==", "dev": true, "funding": [ { @@ -35557,7 +35602,7 @@ } ], "dependencies": { - "@csstools/postcss-cascade-layers": "^4.0.0", + "@csstools/postcss-cascade-layers": "^4.0.1", "@csstools/postcss-color-function": "^3.0.7", "@csstools/postcss-color-mix-function": "^2.0.7", "@csstools/postcss-exponential-functions": "^1.0.1", @@ -35569,6 +35614,8 @@ "@csstools/postcss-initial": "^1.0.0", "@csstools/postcss-is-pseudo-class": "^4.0.3", "@csstools/postcss-logical-float-and-clear": "^2.0.0", + "@csstools/postcss-logical-overflow": "^1.0.0", + "@csstools/postcss-logical-overscroll-behavior": "^1.0.0", "@csstools/postcss-logical-resize": "^2.0.0", "@csstools/postcss-logical-viewport-units": "^2.0.3", "@csstools/postcss-media-minmax": "^1.1.0", @@ -35588,7 +35635,7 @@ "css-blank-pseudo": "^6.0.0", "css-has-pseudo": "^6.0.0", "css-prefers-color-scheme": "^9.0.0", - "cssdb": "^7.8.0", + "cssdb": "^7.9.0", "postcss-attribute-case-insensitive": "^6.0.2", "postcss-clamp": "^4.1.0", "postcss-color-functional-notation": "^6.0.2", @@ -40032,7 +40079,8 @@ "node_modules/tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", - "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==", + "dev": true }, "node_modules/tsutils": { "version": "3.21.0", @@ -40306,9 +40354,9 @@ } }, "node_modules/typescript-plugin-css-modules": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/typescript-plugin-css-modules/-/typescript-plugin-css-modules-5.0.1.tgz", - "integrity": "sha512-hKXObfwfjx2/myRq4JeQ8D3xIWYTFqusi0hS/Aka7RFX1xQEoEkdOGDWyXNb8LmObawsUzbI30gQnZvqYXCrkA==", + "version": "5.0.2", + "resolved": "https://registry.npmjs.org/typescript-plugin-css-modules/-/typescript-plugin-css-modules-5.0.2.tgz", + "integrity": "sha512-ej/Og4Y8mF+43P14P9Ik1MGqNXcXBVgO1TltkESegdnZsaaRXnaJ5CoJmTPRkg25ysQlOV6P94wNhI4VxIzlkw==", "dev": true, "dependencies": { "@types/postcss-modules-local-by-default": "^4.0.0", @@ -40402,6 +40450,12 @@ "through": "^2.3.8" } }, + "node_modules/undici-types": { + "version": "5.26.5", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", + "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==", + "dev": true + }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", @@ -40494,6 +40548,15 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/unified-engine/node_modules/@types/node": { + "version": "18.19.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.2.tgz", + "integrity": "sha512-6wzfBdbWpe8QykUkXBjtmO3zITA0A3FIjoy+in0Y2K4KrCiRhNYJIdwAPDffZ3G6GnaKaSLSEa9ZuORLfEoiwg==", + "dev": true, + "dependencies": { + "undici-types": "~5.26.4" + } + }, "node_modules/unified-engine/node_modules/brace-expansion": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", @@ -40814,9 +40877,9 @@ } }, "node_modules/unist-util-position-from-estree/node_modules/@types/unist": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.0.tgz", - "integrity": "sha512-MFETx3tbTjE7Uk6vvnWINA/1iJ7LuMdO4fcq8UfF0pRbj01aGLduVvQcRyswuACJdpnHgg8E3rQLhaRdNEJS0w==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz", + "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==", "dev": true }, "node_modules/unist-util-remove-position": { diff --git a/package.json b/package.json index 936b355a3b5..46e2f4c4463 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@primer/react", - "version": "36.2.0", + "version": "36.3.1", "description": "An implementation of GitHub's Primer Design System using React", "main": "lib/index.js", "module": "lib-esm/index.js", @@ -103,7 +103,6 @@ "@primer/behaviors": "^1.5.1", "@primer/octicons-react": "^19.8.0", "@primer/primitives": "^7.11.11", - "@react-aria/ssr": "^3.5.0", "@styled-system/css": "^5.1.5", "@styled-system/props": "^5.1.5", "@styled-system/theme-get": "^5.1.2", @@ -132,7 +131,7 @@ "@babel/parser": "7.23.0", "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6", "@babel/plugin-proposal-optional-chaining": "7.21.0", - "@babel/plugin-transform-modules-commonjs": "7.22.15", + "@babel/plugin-transform-modules-commonjs": "7.23.3", "@babel/preset-react": "7.23.3", "@babel/preset-typescript": "7.22.15", "@changesets/changelog-github": "0.4.8", @@ -147,8 +146,8 @@ "@rollup/plugin-node-resolve": "15.1.0", "@rollup/plugin-replace": "5.0.2", "@rollup/plugin-terser": "0.4.3", - "@rollup/plugin-typescript": "11.1.0", - "@rollup/plugin-virtual": "3.0.1", + "@rollup/plugin-typescript": "11.1.5", + "@rollup/plugin-virtual": "3.0.2", "@size-limit/preset-big-lib": "8.2.6", "@storybook/addon-a11y": "7.1.0", "@storybook/addon-actions": "7.1.0", @@ -172,10 +171,10 @@ "@types/jest": "29.5.6", "@types/jest-axe": "3.5.5", "@types/lodash.groupby": "4.6.7", - "@types/lodash.isempty": "4.4.7", + "@types/lodash.isempty": "4.4.9", "@types/lodash.isobject": "3.0.7", "@types/lodash.keyby": "4.6.7", - "@types/node": "18.16.19", + "@types/node": "20.10.3", "@types/react": "18.2.21", "@types/react-dom": "18.2.6", "@types/semver": "7.5.3", @@ -235,9 +234,9 @@ "mdast-util-mdx": "3.0.0", "mdast-util-to-string": "4.0.0", "micromark-extension-frontmatter": "2.0.0", - "micromark-extension-mdxjs": "2.0.0", + "micromark-extension-mdxjs": "3.0.0", "postcss-custom-properties-fallback": "1.0.2", - "postcss-preset-env": "9.2.0", + "postcss-preset-env": "9.3.0", "prettier": "3.0.3", "react": "18.2.0", "react-dnd": "14.0.4", @@ -258,7 +257,7 @@ "ts-node": "10.9.1", "ts-toolbelt": "9.6.0", "typescript": "5.2.2", - "typescript-plugin-css-modules": "5.0.1", + "typescript-plugin-css-modules": "5.0.2", "unist-util-find": "3.0.0", "unist-util-find-before": "4.0.0", "unist-util-flat-filter": "2.0.0", diff --git a/src/ConfirmationDialog/ConfirmationDialog.tsx b/src/ConfirmationDialog/ConfirmationDialog.tsx index d659ab23e1c..0fa9a28dd49 100644 --- a/src/ConfirmationDialog/ConfirmationDialog.tsx +++ b/src/ConfirmationDialog/ConfirmationDialog.tsx @@ -16,7 +16,7 @@ export interface ConfirmationDialogProps { * Required. This callback is invoked when a gesture to close the dialog * is performed. The first argument indicates the gesture. */ - onClose: (gesture: 'confirm' | 'cancel' | 'close-button' | 'cancel' | 'escape') => void + onClose: (gesture: 'confirm' | 'close-button' | 'cancel' | 'escape') => void /** * Required. The title of the ConfirmationDialog. This is usually a brief @@ -145,11 +145,14 @@ export const ConfirmationDialog: React.FC & {content: React.ReactNode} async function confirm(themeProps: ThemeProviderProps, options: ConfirmOptions): Promise { const {content, ...confirmationDialogProps} = options return new Promise(resolve => { - const root = createRoot(document.createElement('div')) + hostElement = document.createElement('div') + if (!hostElement.isConnected) document.body.append(hostElement) + const root = createRoot(hostElement) const onClose: ConfirmationDialogProps['onClose'] = gesture => { root.unmount() if (gesture === 'confirm') { diff --git a/src/NavList/__snapshots__/NavList.test.tsx.snap b/src/NavList/__snapshots__/NavList.test.tsx.snap index fbbcd726f81..c9d6cf86b56 100644 --- a/src/NavList/__snapshots__/NavList.test.tsx.snap +++ b/src/NavList/__snapshots__/NavList.test.tsx.snap @@ -313,10 +313,10 @@ exports[`NavList renders a simple list 1`] = ` >
Home @@ -336,10 +336,10 @@ exports[`NavList renders a simple list 1`] = ` class="c1 c7" >
About @@ -359,10 +359,10 @@ exports[`NavList renders a simple list 1`] = ` class="c1 c7" >
Contact @@ -738,12 +738,12 @@ exports[`NavList renders with groups 1`] = ` >

Overview

  • Getting started @@ -782,22 +782,22 @@ exports[`NavList renders with groups 1`] = ` >

    Components

    • Avatar @@ -1190,15 +1190,15 @@ exports[`NavList.Item with NavList.SubNav does not have active styles if SubNav class="c0" >
      • Sub Item @@ -1673,15 +1673,15 @@ exports[`NavList.Item with NavList.SubNav has active styles if SubNav contains t class="c0" >
        • Sub Item diff --git a/src/PageLayout/PageLayout.features.stories.tsx b/src/PageLayout/PageLayout.features.stories.tsx index 25c704eb2d8..66a4989bd8f 100644 --- a/src/PageLayout/PageLayout.features.stories.tsx +++ b/src/PageLayout/PageLayout.features.stories.tsx @@ -124,6 +124,9 @@ export const StickyPane: Story = args => ( ) })} + + Donec sit amet massa purus. Plura de lorem Ispum. + diff --git a/src/PageLayout/PageLayout.tsx b/src/PageLayout/PageLayout.tsx index a2321b06b40..378d8fe8c3d 100644 --- a/src/PageLayout/PageLayout.tsx +++ b/src/PageLayout/PageLayout.tsx @@ -758,8 +758,8 @@ const Pane = React.forwardRef - { - // Get the number of pixels the divider was dragged - let deltaWithDirection - if (isKeyboard) { - deltaWithDirection = delta - } else { - deltaWithDirection = position === 'end' ? -delta : delta - } - updatePaneWidth(paneWidth + deltaWithDirection) - }} - // Ensure `paneWidth` state and actual pane width are in sync when the drag ends - onDragEnd={() => { - const paneRect = paneRef.current?.getBoundingClientRect() - if (!paneRect) return - updatePaneWidth(paneRect.width) - }} - // Reset pane width on double click - onDoubleClick={() => updatePaneWidth(getDefaultPaneWidth(width))} - /> - {children} + + { + // Get the number of pixels the divider was dragged + let deltaWithDirection + if (isKeyboard) { + deltaWithDirection = delta + } else { + deltaWithDirection = position === 'end' ? -delta : delta + } + updatePaneWidth(paneWidth + deltaWithDirection) + }} + // Ensure `paneWidth` state and actual pane width are in sync when the drag ends + onDragEnd={() => { + const paneRect = paneRef.current?.getBoundingClientRect() + if (!paneRect) return + updatePaneWidth(paneRect.width) + }} + // Reset pane width on double click + onDoubleClick={() => updatePaneWidth(getDefaultPaneWidth(width))} + /> ) }, diff --git a/src/PageLayout/__snapshots__/PageLayout.test.tsx.snap b/src/PageLayout/__snapshots__/PageLayout.test.tsx.snap index ad552cc80d3..bb23bd6bec0 100644 --- a/src/PageLayout/__snapshots__/PageLayout.test.tsx.snap +++ b/src/PageLayout/__snapshots__/PageLayout.test.tsx.snap @@ -109,13 +109,6 @@ exports[`PageLayout renders condensed layout 1`] = ` } .c10 { - height: 100%; - position: relative; - display: none; - margin-right: 16px; -} - -.c11 { --pane-min-width: 256px; --pane-max-width-diff: 511px; --pane-max-width: calc(100vw - var(--pane-max-width-diff)); @@ -123,6 +116,13 @@ exports[`PageLayout renders condensed layout 1`] = ` padding: 0; } +.c11 { + height: 100%; + position: relative; + display: none; + margin-right: 16px; +} + .c12 { -webkit-order: 4; -ms-flex-order: 4; @@ -143,9 +143,9 @@ exports[`PageLayout renders condensed layout 1`] = ` width: auto; margin-top: 0 !important; margin-bottom: 0 !important; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; + -webkit-flex-direction: row-reverse; + -ms-flex-direction: row-reverse; + flex-direction: row-reverse; margin-left: 16px; } } @@ -162,20 +162,20 @@ exports[`PageLayout renders condensed layout 1`] = ` } @media screen and (min-width:768px) { - .c11 { + .c10 { width: 256px; overflow: auto; } } @media screen and (min-width:1012px) { - .c11 { + .c10 { width: 296px; } } @media screen and (min-width:1280px) { - .c11 { + .c10 { --pane-max-width-diff: 959px; } } @@ -226,13 +226,13 @@ exports[`PageLayout renders condensed layout 1`] = ` />
          -
          Pane
          +
          -
          Pane
          +
          -
          Pane
          +
          -
          Pane
          +
          -
          Pane
          +
          Closed Merged export const Queued = () => Queued export const Draft = () => Draft +export const Unavailable = () => Unavailable export const Small = () => ( diff --git a/src/StateLabel/StateLabel.tsx b/src/StateLabel/StateLabel.tsx index 6b7017d6a62..20349220355 100644 --- a/src/StateLabel/StateLabel.tsx +++ b/src/StateLabel/StateLabel.tsx @@ -7,6 +7,7 @@ import { IssueOpenedIcon, QuestionIcon, GitMergeQueueIcon, + AlertIcon, } from '@primer/octicons-react' import React from 'react' import styled from 'styled-components' @@ -26,6 +27,7 @@ const octiconMap = { draft: GitPullRequestIcon, issueDraft: IssueDraftIcon, pullQueued: GitMergeQueueIcon, + unavailable: AlertIcon, } const colorVariants = variant({ @@ -67,6 +69,10 @@ const colorVariants = variant({ backgroundColor: 'neutral.emphasis', color: 'fg.onEmphasis', }, + unavailable: { + backgroundColor: 'neutral.emphasis', + color: 'fg.onEmphasis', + }, }, }) diff --git a/src/__tests__/__snapshots__/ActionMenu.test.tsx.snap b/src/__tests__/__snapshots__/ActionMenu.test.tsx.snap index 0893c7502ea..5f5cd763cca 100644 --- a/src/__tests__/__snapshots__/ActionMenu.test.tsx.snap +++ b/src/__tests__/__snapshots__/ActionMenu.test.tsx.snap @@ -248,7 +248,7 @@ exports[`ActionMenu renders consistently 1`] = ` aria-haspopup="true" className="c1" data-block={null} - id="react-aria-1" + id=":r0:" onClick={[Function]} onKeyDown={[Function]} style={{}} diff --git a/src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap b/src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap index 8196646c9ce..39e09045a50 100644 --- a/src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap +++ b/src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap @@ -86,7 +86,7 @@ exports[`AnchoredOverlay renders consistently 1`] = ` - - - - - - {/* */} -
          - ) -} - -export const TestSxProp = () => { - const count = 4 - return ( -
          - - - - - - -
          - ) -} diff --git a/src/drafts/Button2/Button.docs.json b/src/drafts/Button2/Button.docs.json deleted file mode 100644 index b8a24e7a045..00000000000 --- a/src/drafts/Button2/Button.docs.json +++ /dev/null @@ -1,70 +0,0 @@ -{ - "id": "drafts_button", - "name": "Button2", - "status": "draft", - "a11yReviewed": false, - "stories": [], - "props": [ - { - "name": "children", - "required": true, - "type": "React.ReactNode", - "description": "The content of the button." - }, - { - "name": "variant", - "type": "| 'default'\n| 'primary'\n| 'danger'\n| 'outline'\n| 'invisible'", - "defaultValue": "'default'", - "description": "Change the visual style of the button." - }, - { - "name": "size", - "type": "| 'small'\n| 'medium'\n| 'large'", - "defaultValue": "'medium'" - }, - { - "name": "leadingIcon", - "type": "React.ComponentType", - "description": "An icon to display before the button text." - }, - { - "name": "trailingIcon", - "type": "React.ComponentType", - "description": "An icon to display after the button text." - }, - { - "name": "as", - "type": "React.ElementType", - "defaultValue": "'button'" - }, - { - "name": "sx", - "type": "SystemStyleObject" - }, - { - "name": "ref", - "type": "React.RefObject" - } - ], - "passthrough": { - "element": "button", - "url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attributes" - }, - "subcomponents": [ - { - "name": "Button.Counter", - "props": [ - { - "name": "children", - "required": true, - "type": "number", - "description": "The counter value." - }, - { - "name": "sx", - "type": "SystemStyleObject" - } - ] - } - ] -} diff --git a/src/drafts/Button2/Button.features.stories.tsx b/src/drafts/Button2/Button.features.stories.tsx deleted file mode 100644 index ab0fce76123..00000000000 --- a/src/drafts/Button2/Button.features.stories.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import {EyeIcon, TriangleDownIcon, HeartIcon} from '@primer/octicons-react' -import React, {useState} from 'react' -import {Button2 as Button} from '.' - -export default { - title: 'Drafts/Components/Button/Features', -} - -export const Primary = () => - -export const Danger = () => - -export const Invisible = () => - -export const Outline = () => - -export const LeadingVisual = () => - -export const TrailingVisual = () => - -export const TrailingCounter = () => { - const [count, setCount] = useState(0) - return ( - - ) -} - -export const TrailingAction = () => - -export const Block = () => - -export const Disabled = () => - -export const Small = () => - -export const Medium = () => - -export const Large = () => diff --git a/src/drafts/Button2/Button.stories.tsx b/src/drafts/Button2/Button.stories.tsx deleted file mode 100644 index 32a841e66c4..00000000000 --- a/src/drafts/Button2/Button.stories.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import React from 'react' -import {EyeClosedIcon, EyeIcon, SearchIcon, TriangleDownIcon, XIcon, HeartIcon} from '@primer/octicons-react' -import {Meta, StoryFn} from '@storybook/react' -import {Button2 as Button} from '.' -import {OcticonArgType} from '../../utils/story-helpers' - -export default { - title: 'Drafts/Components/Button', - argTypes: { - size: { - control: { - type: 'radio', - }, - options: ['small', 'medium', 'large'], - }, - disabled: { - control: { - type: 'boolean', - }, - }, - variant: { - control: { - type: 'radio', - }, - options: ['default', 'primary', 'danger', 'invisible', 'outline'], - }, - alignContent: { - control: { - type: 'radio', - }, - options: ['center', 'start'], - }, - block: { - control: { - type: 'boolean', - }, - }, - leadingIcon: OcticonArgType([EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon]), - trailingIcon: OcticonArgType([EyeClosedIcon, EyeIcon, SearchIcon, XIcon, HeartIcon]), - trailingAction: OcticonArgType([TriangleDownIcon]), - trailingVisualCount: { - control: { - type: 'number', - }, - }, - }, - args: { - block: false, - size: 'medium', - disabled: false, - variant: 'default', - alignContent: 'center', - trailingIcon: null, - leadingIcon: null, - trailingAction: null, - trailingVisualCount: undefined, - }, -} as Meta - -export const Playground: StoryFn = args => { - const {trailingVisualCount, ...rest} = args - return ( - - ) -} - -export const Default = () => diff --git a/src/drafts/Button2/Button.tsx b/src/drafts/Button2/Button.tsx deleted file mode 100644 index d3cce915480..00000000000 --- a/src/drafts/Button2/Button.tsx +++ /dev/null @@ -1,90 +0,0 @@ -import React, {forwardRef} from 'react' -import {ButtonProps} from './types' -import {ButtonBase} from './ButtonBase' -import {ForwardRefComponent as PolymorphicForwardRefComponent} from '../../utils/polymorphic' -import {defaultSxProp} from '../../utils/defaultSxProp' -import {BetterSystemStyleObject} from '../../sx' - -const ButtonComponent = forwardRef(({children, sx: sxProp = defaultSxProp, ...props}, forwardedRef): JSX.Element => { - let sxStyles = sxProp - - // grap the button props that have associated data attributes in the styles - const {block, size, leadingIcon, trailingIcon, trailingAction} = props - - if (sxProp !== null && Object.keys(sxProp).length > 0) { - sxStyles = generateCustomSxProp({block, size, leadingIcon, trailingIcon, trailingAction}, sxProp) - } - - return ( - - {children} - - ) -}) as PolymorphicForwardRefComponent<'button', ButtonProps> - -// This function is used to generate a custom cssSelector for the sxProp - -// The usual sx prop can like this: -// sx={{ -// [`@media (max-width: 768px)`]: { -// '& > ul': { -// backgroundColor: 'deeppink', -// }, -// '&:hover': { -// backgroundColor: 'yellow', -// }, -// }, -// '&:hover': { -// backgroundColor: 'yellow', -// }, -// '&': { -// width : 320px -// } -// }} -//* -/* What we want for Button styles is this: -sx={{ -// [`@media (max-width: 768px)`]: { -// '&[data-attribute="something"] > ul': { -// backgroundColor: 'deeppink', -// }, -// '&[data-attribute="something"]:hover': { -// backgroundColor: 'yellow', -// }, -// }, -// '&[data-attribute="something"]:hover': { -// backgroundColor: 'yellow', -// }, -// '&[data-attribute="something"]': { -// width : 320px -// } -// }} - -// We need to make sure we append the customCSSSelector to the original class selector. i.e & - > &[data-attribute="Icon"][data-size="small"] -*/ -export function generateCustomSxProp( - props: Partial>, - providedSx: BetterSystemStyleObject, -) { - // Possible data attributes: data-size, data-block, data-no-visuals - const size = props.size && props.size !== 'medium' ? `[data-size="${props.size}"]` : '' // medium is a default size therefore it doesn't have a data attribute that used for styling - const block = props.block ? `[data-block="block"]` : '' - const noVisuals = props.leadingIcon || props.trailingIcon || props.trailingAction ? '' : '[data-no-visuals="true"]' - - // this is custom selector. We need to make sure we add the data attributes to the base css class (& -> &[data-attributename="value"]]) - const cssSelector = `&${size}${block}${noVisuals}` // &[data-size="small"][data-block="block"][data-no-visuals="true"] - - const customSxProp: { - [key: string]: BetterSystemStyleObject - } = {} - - if (!providedSx) return customSxProp - else { - customSxProp[cssSelector] = providedSx - return customSxProp - } -} - -ButtonComponent.displayName = 'Button' - -export {ButtonComponent} diff --git a/src/drafts/Button2/ButtonBase.tsx b/src/drafts/Button2/ButtonBase.tsx deleted file mode 100644 index 44125f7dbd0..00000000000 --- a/src/drafts/Button2/ButtonBase.tsx +++ /dev/null @@ -1,101 +0,0 @@ -import React, {ComponentPropsWithRef, forwardRef, useMemo} from 'react' -import {ForwardRefComponent as PolymorphicForwardRefComponent} from '../../utils/polymorphic' -import Box from '../../Box' -import {BetterSystemStyleObject, merge} from '../../sx' -import {useTheme} from '../../ThemeProvider' -import {ButtonProps, StyledButton} from './types' -import {getVariantStyles, getButtonStyles, getAlignContentSize} from './styles' -import {useRefObjectAsForwardedRef} from '../../hooks/useRefObjectAsForwardedRef' -import {defaultSxProp} from '../../utils/defaultSxProp' - -const ButtonBase = forwardRef( - ({children, as: Component = 'button', sx: sxProp = defaultSxProp, ...props}, forwardedRef): JSX.Element => { - const { - leadingIcon: LeadingIcon, - trailingIcon: TrailingIcon, - trailingAction: TrailingAction, - icon: Icon, - variant = 'default', - size = 'medium', - alignContent = 'center', - block = false, - ...rest - } = props - - const innerRef = React.useRef(null) - useRefObjectAsForwardedRef(forwardedRef, innerRef) - - const {theme} = useTheme() - const baseStyles = useMemo(() => { - return merge.all([getButtonStyles(theme), getVariantStyles(variant, theme)]) - }, [theme, variant]) - const sxStyles = useMemo(() => { - return merge(baseStyles, sxProp) - }, [baseStyles, sxProp]) - const iconWrapStyles = { - display: 'flex', - pointerEvents: 'none', - } - - if (__DEV__) { - /** - * The Linter yells because it thinks this conditionally calls an effect, - * but since this is a compile-time flag and not a runtime conditional - * this is safe, and ensures the entire effect is kept out of prod builds - * shaving precious bytes from the output, and avoiding mounting a noop effect - */ - // eslint-disable-next-line react-hooks/rules-of-hooks - React.useEffect(() => { - if ( - innerRef.current && - !(innerRef.current instanceof HTMLButtonElement) && - !((innerRef.current as unknown) instanceof HTMLAnchorElement) - ) { - // eslint-disable-next-line no-console - console.warn('This component should be an instanceof a semantic button or anchor') - } - }, [innerRef]) - } - - return ( - - {Icon ? ( - - ) : ( - <> - - {LeadingIcon && ( - - - - )} - {children && {children}} - {TrailingIcon && ( - - - - )} - - {TrailingAction && ( - - - - )} - - )} - - ) - }, -) as PolymorphicForwardRefComponent<'button' | 'a', ButtonProps> - -export type ButtonBaseProps = ComponentPropsWithRef - -export {ButtonBase} diff --git a/src/drafts/Button2/ButtonCounter.tsx b/src/drafts/Button2/ButtonCounter.tsx deleted file mode 100644 index 6f81aeb2aab..00000000000 --- a/src/drafts/Button2/ButtonCounter.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import React from 'react' -import {SxProp} from '../../sx' -import CounterLabel from '../../CounterLabel' -import {defaultSxProp} from '../../utils/defaultSxProp' - -export type CounterProps = { - children: number -} & SxProp - -const Counter = ({children, sx: sxProp = defaultSxProp, ...props}: CounterProps) => { - // we need to make sure we add the sx styles to the css selector that has the highest specificity. - const cssSelector = `&[data-component="ButtonCounter"]` - - const counterButtonStyles = { - [cssSelector]: sxProp, - } - return ( - - {children} - - ) -} - -export {Counter} diff --git a/src/drafts/Button2/index.ts b/src/drafts/Button2/index.ts deleted file mode 100644 index 5bebc2d158b..00000000000 --- a/src/drafts/Button2/index.ts +++ /dev/null @@ -1,7 +0,0 @@ -import {ButtonComponent} from './Button' -import {Counter} from './ButtonCounter' -export type {ButtonProps, IconButtonProps} from './types' - -export const Button2 = Object.assign(ButtonComponent, { - Counter, -}) diff --git a/src/drafts/Button2/styles.ts b/src/drafts/Button2/styles.ts deleted file mode 100644 index 474a9e81991..00000000000 --- a/src/drafts/Button2/styles.ts +++ /dev/null @@ -1,316 +0,0 @@ -import {VariantType, AlignContent} from './types' -import {Theme} from '../../ThemeProvider' - -export const getVariantStyles = (variant: VariantType = 'default', theme?: Theme) => { - const style = { - default: { - color: 'btn.text', - backgroundColor: 'btn.bg', - boxShadow: `${theme?.shadows.btn.shadow}, ${theme?.shadows.btn.insetShadow}`, - '&:hover:not([disabled])': { - backgroundColor: 'btn.hoverBg', - borderColor: 'btn.hoverBorder', - }, - '&:active:not([disabled])': { - backgroundColor: 'btn.activeBg', - borderColor: 'btn.activeBorder', - }, - '&:disabled': { - color: 'primer.fg.disabled', - '[data-component=ButtonCounter]': { - color: 'inherit', - }, - }, - '&[aria-expanded=true]': { - backgroundColor: 'btn.activeBg', - borderColor: 'btn.activeBorder', - }, - }, - primary: { - color: 'btn.primary.text', - backgroundColor: 'btn.primary.bg', - borderColor: 'btn.primary.border', - boxShadow: `${theme?.shadows.btn.primary.shadow}`, - '&:hover:not([disabled])': { - color: 'btn.primary.hoverText', - backgroundColor: 'btn.primary.hoverBg', - }, - '&:focus:not([disabled])': { - boxShadow: 'inset 0 0 0 3px', - }, - '&:focus-visible:not([disabled])': { - boxShadow: 'inset 0 0 0 3px', - }, - '&:active:not([disabled])': { - backgroundColor: 'btn.primary.selectedBg', - boxShadow: `${theme?.shadows.btn.primary.selectedShadow}`, - }, - '&:disabled': { - color: 'btn.primary.disabledText', - backgroundColor: 'btn.primary.disabledBg', - '[data-component=ButtonCounter]': { - color: 'inherit', - }, - }, - '[data-component=ButtonCounter]': { - backgroundColor: 'btn.primary.counterBg', - color: 'btn.primary.text', - }, - '&[aria-expanded=true]': { - backgroundColor: 'btn.primary.selectedBg', - boxShadow: `${theme?.shadows.btn.primary.selectedShadow}`, - }, - }, - danger: { - color: 'btn.danger.text', - backgroundColor: 'btn.bg', - boxShadow: `${theme?.shadows.btn.shadow}`, - '&:hover:not([disabled])': { - color: 'btn.danger.hoverText', - backgroundColor: 'btn.danger.hoverBg', - borderColor: 'btn.danger.hoverBorder', - boxShadow: `${theme?.shadows.btn.danger.hoverShadow}`, - '[data-component=ButtonCounter]': { - backgroundColor: 'btn.danger.hoverCounterBg', - color: 'btn.danger.hoverText', - }, - }, - '&:active:not([disabled])': { - color: 'btn.danger.selectedText', - backgroundColor: 'btn.danger.selectedBg', - boxShadow: `${theme?.shadows.btn.danger.selectedShadow}`, - borderColor: 'btn.danger.selectedBorder', - }, - '&:disabled': { - color: 'btn.danger.disabledText', - backgroundColor: 'btn.danger.disabledBg', - borderColor: 'btn.danger.disabledBorder', - '[data-component=ButtonCounter]': { - color: 'inherit', - backgroundColor: 'btn.danger.disabledCounterBg', - }, - }, - '[data-component=ButtonCounter]': { - color: 'btn.danger.text', - backgroundColor: 'btn.danger.counterBg', - }, - '&[aria-expanded=true]': { - color: 'btn.danger.selectedText', - backgroundColor: 'btn.danger.selectedBg', - boxShadow: `${theme?.shadows.btn.danger.selectedShadow}`, - borderColor: 'btn.danger.selectedBorder', - }, - }, - invisible: { - color: 'accent.fg', - backgroundColor: 'transparent', - borderColor: 'transparent', - boxShadow: 'none', - '&:hover:not([disabled])': { - backgroundColor: 'btn.hoverBg', - }, - '&:active:not([disabled])': { - backgroundColor: 'btn.selectedBg', - }, - '&:disabled': { - color: 'primer.fg.disabled', - '[data-component=ButtonCounter]': { - color: 'inherit', - }, - }, - '&[aria-expanded=true]': { - backgroundColor: 'btn.selectedBg', - }, - '&[data-component="IconButton"][data-no-visuals]': { - color: 'fg.muted', - }, - '[data-component="trailingAction"]': { - color: 'fg.muted', - }, - '[data-component="leadingVisual"]': { - color: 'fg.muted', - }, - '&[data-no-visuals]': { - color: 'accent.fg', - }, - '&:has([data-component="ButtonCounter"])': { - color: 'accent.fg', - }, - }, - outline: { - color: 'btn.outline.text', - boxShadow: `${theme?.shadows.btn.shadow}`, - borderColor: 'btn.border', - backgroundColor: 'btn.bg', - - '&:hover:not([disabled])': { - color: 'btn.outline.hoverText', - backgroundColor: 'btn.outline.hoverBg', - borderColor: 'btn.outline.hoverBorder', - boxShadow: `${theme?.shadows.btn.outline.hoverShadow}`, - '[data-component=ButtonCounter]': { - backgroundColor: 'btn.outline.hoverCounterBg', - color: 'inherit', - }, - }, - '&:active:not([disabled])': { - color: 'btn.outline.selectedText', - backgroundColor: 'btn.outline.selectedBg', - boxShadow: `${theme?.shadows.btn.outline.selectedShadow}`, - borderColor: 'btn.outline.selectedBorder', - }, - - '&:disabled': { - color: 'btn.outline.disabledText', - backgroundColor: 'btn.outline.disabledBg', - borderColor: 'btn.border', - '[data-component=ButtonCounter]': { - backgroundColor: 'btn.outline.disabledCounterBg', - color: 'inherit', - }, - }, - '[data-component=ButtonCounter]': { - backgroundColor: 'btn.outline.counterBg', - color: 'btn.outline.text', - }, - '&[aria-expanded=true]': { - color: 'btn.outline.selectedText', - backgroundColor: 'btn.outline.selectedBg', - boxShadow: `${theme?.shadows.btn.outline.selectedShadow}`, - borderColor: 'btn.outline.selectedBorder', - }, - }, - } - return style[variant] -} - -export const getBaseStyles = (theme?: Theme) => ({ - borderRadius: '2', - border: '1px solid', - borderColor: theme?.colors.btn.border, - fontFamily: 'inherit', - fontWeight: 'semibold', - fontSize: '1', - cursor: 'pointer', - appearance: 'none', - userSelect: 'none', - textDecoration: 'none', - textAlign: 'center', - display: 'flex', - alignItems: 'center', - justifyContent: 'space-between', - height: '32px', - padding: '0 12px', - gap: '8px', - minWidth: 'max-content', - transition: '80ms cubic-bezier(0.65, 0, 0.35, 1)', - transitionProperty: 'color, fill, background-color, border-color', - '&[href]': { - display: 'inline-flex', - '&:hover': { - textDecoration: 'none', - }, - }, - '&:hover': { - transitionDuration: '80ms', - }, - '&:active': { - transition: 'none', - }, - '&:disabled': { - cursor: 'not-allowed', - boxShadow: 'none', - }, - '@media (forced-colors: active)': { - '&:focus': { - // Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips - outline: 'solid 1px transparent', - }, - }, - '[data-component=ButtonCounter]': { - fontSize: '1', - }, - '&[data-component=IconButton]': { - display: 'inline-grid', - padding: 'unset', - placeContent: 'center', - width: '32px', - minWidth: 'unset', - }, - '&[data-size="small"]': { - padding: '0 8px', - height: '28px', - gap: '4px', - fontSize: '0', - - '[data-component="text"]': { - lineHeight: 'calc(20 / 12)', - }, - - '[data-component=ButtonCounter]': { - fontSize: '0', - }, - - '[data-component="buttonContent"] > :not(:last-child)': { - mr: '4px', - }, - - '&[data-component=IconButton]': { - width: '28px', - padding: 'unset', - }, - }, - '&[data-size="large"]': { - padding: '0 16px', - height: '40px', - gap: '8px', - - '[data-component="buttonContent"] > :not(:last-child)': { - mr: '8px', - }, - - '&[data-component=IconButton]': { - width: '40px', - padding: 'unset', - }, - }, -}) - -export const getButtonStyles = (theme?: Theme) => { - const styles = { - ...getBaseStyles(theme), - '&[data-block="block"]': { - width: '100%', - }, - '[data-component="leadingVisual"]': { - gridArea: 'leadingVisual', - }, - '[data-component="text"]': { - gridArea: 'text', - lineHeight: 'calc(20/14)', - whiteSpace: 'nowrap', - }, - '[data-component="trailingVisual"]': { - gridArea: 'trailingVisual', - }, - '[data-component="trailingAction"]': { - marginRight: '-4px', - }, - '[data-component="buttonContent"]': { - flex: '1 0 auto', - display: 'grid', - gridTemplateAreas: '"leadingVisual text trailingVisual"', - gridTemplateColumns: 'min-content minmax(0, auto) min-content', - alignItems: 'center', - alignContent: 'center', - }, - '[data-component="buttonContent"] > :not(:last-child)': { - mr: '8px', - }, - } - return styles -} - -export const getAlignContentSize = (alignContent: AlignContent = 'center') => ({ - justifyContent: alignContent === 'center' ? 'center' : 'flex-start', -}) diff --git a/src/drafts/Button2/types.ts b/src/drafts/Button2/types.ts deleted file mode 100644 index 7194fd0d354..00000000000 --- a/src/drafts/Button2/types.ts +++ /dev/null @@ -1,81 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import sx, {SxProp} from '../../sx' -import getGlobalFocusStyles from '../../internal/utils/getGlobalFocusStyles' - -export const StyledButton = styled.button` - ${getGlobalFocusStyles('-2px')}; - ${sx}; -` - -export type VariantType = 'default' | 'primary' | 'invisible' | 'danger' | 'outline' - -export type Size = 'small' | 'medium' | 'large' - -export type AlignContent = 'start' | 'center' - -type ButtonA11yProps = - | {'aria-label': string; 'aria-labelledby'?: undefined} - | {'aria-label'?: undefined; 'aria-labelledby': string} - -export type ButtonBaseProps = { - /** - * Determine's the styles on a button one of 'default' | 'primary' | 'invisible' | 'danger' | 'outline' - */ - variant?: VariantType - /** - * Size of button and fontSize of text in button - */ - size?: Size - /** - * Items that are disabled can not be clicked, selected, or navigated through. - */ - disabled?: boolean - /** - * Allow button width to fill its container. - */ - block?: boolean -} & SxProp & - React.ButtonHTMLAttributes - -export type ButtonProps = { - /** - * The icon for the IconButton - */ - icon?: React.ElementType | null | undefined - /** - * The leading icon comes before button content - */ - leadingIcon?: React.ElementType | null | undefined - /** - * The trailing icon comes after button content - */ - trailingIcon?: React.ElementType | null | undefined - /** - * Trailing action appears to the right of the trailing visual and is always locked to the end - */ - trailingAction?: React.ElementType | null | undefined - children: React.ReactNode - /** - * Content alignment for when visuals are present - */ - alignContent?: AlignContent -} & ButtonBaseProps - -export type IconButtonProps = ButtonA11yProps & { - icon: React.ComponentType -} & Omit - -// adopted from React.AnchorHTMLAttributes -export type LinkButtonProps = { - underline?: boolean - download?: string - href?: string - hrefLang?: string - media?: string - ping?: string - rel?: string - target?: string - type?: string - referrerPolicy?: React.AnchorHTMLAttributes['referrerPolicy'] -} diff --git a/src/drafts/MarkdownEditor/MarkdownEditor.tsx b/src/drafts/MarkdownEditor/MarkdownEditor.tsx index 03bcd6017b0..ad36ce2d674 100644 --- a/src/drafts/MarkdownEditor/MarkdownEditor.tsx +++ b/src/drafts/MarkdownEditor/MarkdownEditor.tsx @@ -405,6 +405,7 @@ const MarkdownEditor = forwardRef( ? { outline: '2px solid', outlineColor: 'accent.emphasis', + outlineOffset: '-1px', } : {}, ...sx, diff --git a/src/drafts/MarkdownEditor/_MarkdownInput.tsx b/src/drafts/MarkdownEditor/_MarkdownInput.tsx index e22a0858590..305fa9290e6 100644 --- a/src/drafts/MarkdownEditor/_MarkdownInput.tsx +++ b/src/drafts/MarkdownEditor/_MarkdownInput.tsx @@ -162,6 +162,7 @@ export const MarkdownInput = forwardRef display: visible ? undefined : 'none', '&: focus-within': { boxShadow: 'none', + outline: 'none', }, '& textarea': { lineHeight: 1.2, diff --git a/src/drafts/MarkdownEditor/_useListEditing.ts b/src/drafts/MarkdownEditor/_useListEditing.ts index ccebce8b5b1..ac10fd94c2d 100644 --- a/src/drafts/MarkdownEditor/_useListEditing.ts +++ b/src/drafts/MarkdownEditor/_useListEditing.ts @@ -29,10 +29,11 @@ const calculateNextListItemStarter = ({leadingWhitespace = '', delimeter, taskBo * 3. Task box (optional) * 4. Everything following */ -export const listItemRegex = /^(\s*)([*-]|(\d+)\.)\s(?:(\[[\sx]\])\s)?(.*)/i +export const listItemRegex = /^(\s*)([*-]|(\d+)\.)(\s{1,4})(?:(\[[\sx]\])\s)?(.*)/i export type ListItem = { leadingWhitespace: string + middleWhitespace: string text: string delimeter: '-' | '*' | number taskBox: '[ ]' | '[x]' | null @@ -45,7 +46,7 @@ const isNumericListItem = (item: ListItem | null): item is NumericListItem => ty export const parseListItem = (line: string): ListItem | null => { const result = listItemRegex.exec(line) if (!result) return null - const [, leadingWhitespace = '', fullDelimeter, itemNumberStr = '', taskBox = null, text] = result + const [, leadingWhitespace = '', fullDelimeter, itemNumberStr = '', middleWhitespace, taskBox = null, text] = result const itemNumber = Number.parseInt(itemNumberStr, 10) const delimeter = Number.isNaN(itemNumber) ? (fullDelimeter as '*' | '-') : itemNumber @@ -53,14 +54,15 @@ export const parseListItem = (line: string): ListItem | null => { leadingWhitespace, text, delimeter, + middleWhitespace, taskBox: taskBox as '[ ]' | '[x]' | null, } } export const listItemToString = (item: ListItem) => `${item.leadingWhitespace}${typeof item.delimeter === 'number' ? `${item.delimeter}.` : item.delimeter}${ - item.taskBox ? ` ${item.taskBox}` : '' - } ${item.text}` + item.middleWhitespace + }${item.taskBox || ''} ${item.text}` /** * Provides support for list editing in the Markdown editor. This includes inserting new diff --git a/src/hooks/useId.ts b/src/hooks/useId.ts index b951b256b02..007da7941eb 100644 --- a/src/hooks/useId.ts +++ b/src/hooks/useId.ts @@ -1,34 +1,16 @@ -// eslint-disable-next-line no-restricted-imports, import/no-namespace -import * as React from 'react' -// eslint-disable-next-line no-restricted-imports -import {useSSRSafeId} from '@react-aria/ssr' +import {useId as useReactId} from 'react' /** - * Detect if `React.useId()` is present. This strategy is a workaround for: - * https://github.com/webpack/webpack/issues/14814 + * Generate a unique id to be used in a component. If an `id` is provided, it + * will be used instead. * - * This technique is inspired by Material UI: - * https://github.com/mui/material-ui/blob/7bc478ec00a3b5625427f36c827e00b0a17be3d0/packages/mui-utils/src/useId.ts#L21 + * @param id - An optional value to be used instead of generating a unique id. + * Useful when accepting an optional `id` as a prop in a component. */ -// eslint-disable-next-line @typescript-eslint/no-explicit-any, no-useless-concat -const useReactId: undefined | (() => string) = (React as any)['useId' + ''] - -export function useId(id?: string) { - // Force useSSRSafeId in test environments to maintain snapshot parity between - // major versions of React - if (process.env.NODE_ENV === 'test') { - // eslint-disable-next-line react-hooks/rules-of-hooks - return useSSRSafeId(id) - } - - if (useReactId !== undefined) { - if (id) { - return id - } - // eslint-disable-next-line react-hooks/rules-of-hooks - return useReactId() +export function useId(id?: string): string { + const uniqueId = useReactId() + if (id) { + return id } - - // eslint-disable-next-line react-hooks/rules-of-hooks - return useSSRSafeId(id) + return uniqueId } diff --git a/src/internal/components/TextInputWrapper.tsx b/src/internal/components/TextInputWrapper.tsx index 3d2be80211e..f79afeec918 100644 --- a/src/internal/components/TextInputWrapper.tsx +++ b/src/internal/components/TextInputWrapper.tsx @@ -76,16 +76,16 @@ const renderFocusStyles = (hasTrailingAction: boolean, isInputFocused: boolean) isInputFocused && css` border-color: ${get('colors.accent.fg')}; - outline: none; - box-shadow: inset 0 0 0 1px ${get('colors.accent.fg')}; + outline: 2px solid ${get('colors.accent.fg')}; + outline-offset: -1px; ` ) } return css` &:focus-within { border-color: ${get('colors.accent.fg')}; - outline: none; - box-shadow: inset 0 0 0 1px ${get('colors.accent.fg')}; + outline: 2px solid ${get('colors.accent.fg')}; + outline-offset: -1px; } ` } @@ -103,6 +103,7 @@ export const TextInputBaseWrapper = styled.span` display: inline-flex; align-items: stretch; min-height: 32px; + overflow: hidden; input, textarea { diff --git a/src/utils/ssr.tsx b/src/utils/ssr.tsx index a74b004a343..794001e49ec 100644 --- a/src/utils/ssr.tsx +++ b/src/utils/ssr.tsx @@ -1,2 +1,8 @@ -// eslint-disable-next-line no-restricted-imports -export {SSRProvider, useSSRSafeId} from '@react-aria/ssr' +import type {PropsWithChildren} from 'react' +import {useId} from '../hooks/useId' + +export function SSRProvider({children}: PropsWithChildren) { + return children +} + +export const useSSRSafeId = useId