From 92435c0d271e8086cca4f9884f4ccf65620ded5b Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Wed, 7 Jan 2026 16:34:04 +0000 Subject: [PATCH] Version Packages --- .changeset/curvy-walls-exist.md | 4 -- .changeset/four-fans-pump.md | 5 -- .changeset/fresh-spiders-push.md | 5 -- .changeset/green-dryers-flow.md | 5 -- .changeset/optimized-page-layout-resize.md | 17 ------- .changeset/perf-autocomplete-context-split.md | 8 --- .changeset/perf-basestyles-has-selector.md | 8 --- .changeset/perf-dialog-has-selector.md | 10 ---- .../perf-hasinteractivenodes-cleanup.md | 9 ---- examples/codesandbox/package.json | 2 +- examples/nextjs/package.json | 2 +- examples/theming/package.json | 2 +- packages/react/CHANGELOG.md | 51 +++++++++++++++++++ packages/react/package.json | 2 +- 14 files changed, 55 insertions(+), 75 deletions(-) delete mode 100644 .changeset/curvy-walls-exist.md delete mode 100644 .changeset/four-fans-pump.md delete mode 100644 .changeset/fresh-spiders-push.md delete mode 100644 .changeset/green-dryers-flow.md delete mode 100644 .changeset/optimized-page-layout-resize.md delete mode 100644 .changeset/perf-autocomplete-context-split.md delete mode 100644 .changeset/perf-basestyles-has-selector.md delete mode 100644 .changeset/perf-dialog-has-selector.md delete mode 100644 .changeset/perf-hasinteractivenodes-cleanup.md diff --git a/.changeset/curvy-walls-exist.md b/.changeset/curvy-walls-exist.md deleted file mode 100644 index 634d82842c1..00000000000 --- a/.changeset/curvy-walls-exist.md +++ /dev/null @@ -1,4 +0,0 @@ ---- ---- - -ActionBar: Adds new prop `returnFocusRef` to `ActionBar.Menu` to change where focus lands when the menu is closed diff --git a/.changeset/four-fans-pump.md b/.changeset/four-fans-pump.md deleted file mode 100644 index 5aa62707c55..00000000000 --- a/.changeset/four-fans-pump.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@primer/react': minor ---- - -Adds character counts to TextInput and TextArea components diff --git a/.changeset/fresh-spiders-push.md b/.changeset/fresh-spiders-push.md deleted file mode 100644 index 48f5067f5f6..00000000000 --- a/.changeset/fresh-spiders-push.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -update SelectPanel Multi Select Modal story diff --git a/.changeset/green-dryers-flow.md b/.changeset/green-dryers-flow.md deleted file mode 100644 index f2a30486be7..00000000000 --- a/.changeset/green-dryers-flow.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -Add focusPrependedElements prop to useFocusZone, FilteredActionList, and SelectPanel diff --git a/.changeset/optimized-page-layout-resize.md b/.changeset/optimized-page-layout-resize.md deleted file mode 100644 index 6584fae7ebc..00000000000 --- a/.changeset/optimized-page-layout-resize.md +++ /dev/null @@ -1,17 +0,0 @@ ---- -"@primer/react": patch ---- - -PageLayout: Optimize drag/resize performance with inline styles and new optimizations - -**Refactored:** -- Use direct attribute selectors (`.Pane[data-dragging='true']`) instead of descendant selectors for CSS containment (O(1) vs O(n) selector matching) -- Extract optimization utilities to `paneUtils.ts` -- Apply drag handle visual feedback via inline styles and CSS variables - -**Added:** -- `content-visibility: auto` during drag/resize to skip off-screen content rendering -- rAF throttle for drag updates (one update per frame, latest position wins) -- Containment during window resize (parity with drag) - -These changes improve style recalculation performance on large DOMs (100k+ nodes) by eliminating descendant selector traversal. diff --git a/.changeset/perf-autocomplete-context-split.md b/.changeset/perf-autocomplete-context-split.md deleted file mode 100644 index 81745b0bbdb..00000000000 --- a/.changeset/perf-autocomplete-context-split.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -'@primer/react': patch ---- - -perf(Autocomplete): Split context to reduce unnecessary re-renders - -Split AutocompleteContext into separate contexts for static values, setters, and dynamic state. -Components now subscribe only to the context slices they need, reducing re-renders. diff --git a/.changeset/perf-basestyles-has-selector.md b/.changeset/perf-basestyles-has-selector.md deleted file mode 100644 index f16c623c300..00000000000 --- a/.changeset/perf-basestyles-has-selector.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -'@primer/react': patch ---- - -perf(BaseStyles): Remove expensive :has([data-color-mode]) selectors - -Remove `:has([data-color-mode])` selectors that scanned the entire DOM on every style recalculation. -Input color-scheme is already handled by global selectors in the codebase. diff --git a/.changeset/perf-dialog-has-selector.md b/.changeset/perf-dialog-has-selector.md deleted file mode 100644 index bc6b83d2b5e..00000000000 --- a/.changeset/perf-dialog-has-selector.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -'@primer/react': patch ---- - -perf(Dialog): Add feature flag for CSS :has() selector performance optimization - -- Add `primer_react_css_has_selector_perf` feature flag (default: false) -- When flag is OFF: uses legacy `body:has(.Dialog.DisableScroll)` selector -- When flag is ON: uses optimized direct `body[data-dialog-scroll-disabled]` data attribute with ref counting -- Enables gradual rollout and easy rollback of performance optimization diff --git a/.changeset/perf-hasinteractivenodes-cleanup.md b/.changeset/perf-hasinteractivenodes-cleanup.md deleted file mode 100644 index 22c65c21226..00000000000 --- a/.changeset/perf-hasinteractivenodes-cleanup.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -'@primer/react': patch ---- - -perf(hasInteractiveNodes): Optimize with combined selector and early attribute checks - -- Use combined querySelectorAll selector instead of recursive traversal -- Check attribute-based states (disabled, hidden, inert) before getComputedStyle -- Only call getComputedStyle when CSS-based visibility check is needed diff --git a/examples/codesandbox/package.json b/examples/codesandbox/package.json index 70cf7289f8f..547e8978062 100644 --- a/examples/codesandbox/package.json +++ b/examples/codesandbox/package.json @@ -17,7 +17,7 @@ "@types/react": "^18.3.11", "@types/react-dom": "^18.3.0", "@vitejs/plugin-react": "^4.3.3", - "@primer/react": "38.6.2", + "@primer/react": "38.7.0", "@primer/styled-react": "1.0.2", "styled-components": "5.x", "typescript": "^5.9.2", diff --git a/examples/nextjs/package.json b/examples/nextjs/package.json index ed2d90d4f0b..6ef3b358819 100644 --- a/examples/nextjs/package.json +++ b/examples/nextjs/package.json @@ -10,7 +10,7 @@ "type-check": "tsc --noEmit" }, "dependencies": { - "@primer/react": "38.6.2", + "@primer/react": "38.7.0", "@primer/styled-react": "1.0.2", "next": "^16.0.10", "react": "^19.2.0", diff --git a/examples/theming/package.json b/examples/theming/package.json index 5f0cf621ad7..94dc9417172 100644 --- a/examples/theming/package.json +++ b/examples/theming/package.json @@ -11,7 +11,7 @@ }, "dependencies": { "@primer/octicons-react": "^19.21.0", - "@primer/react": "38.6.2", + "@primer/react": "38.7.0", "@primer/styled-react": "1.0.2", "clsx": "^2.1.1", "next": "^16.0.10", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index cb0790dd2ea..46b7ccbb26f 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,56 @@ # @primer/react +## 38.7.0 + +### Minor Changes + +- [#7293](https://github.com/primer/react/pull/7293) [`d418509`](https://github.com/primer/react/commit/d418509884c6eb725e08c818f494e5e15495d4a1) Thanks [@lindseywild](https://github.com/lindseywild)! - Adds character counts to TextInput and TextArea components + +### Patch Changes + +- [#7354](https://github.com/primer/react/pull/7354) [`efbebdf`](https://github.com/primer/react/commit/efbebdf6589bf454ab78f17c83dc84ce88145e7b) Thanks [@llastflowers](https://github.com/llastflowers)! - update SelectPanel Multi Select Modal story + +- [#7426](https://github.com/primer/react/pull/7426) [`094be60`](https://github.com/primer/react/commit/094be609691f481bfc3c3c4eeae092e38f27167c) Thanks [@kelsey-myers](https://github.com/kelsey-myers)! - Add focusPrependedElements prop to useFocusZone, FilteredActionList, and SelectPanel + +- [#7349](https://github.com/primer/react/pull/7349) [`713d5a5`](https://github.com/primer/react/commit/713d5a5c5616e005cf8e939f33f8526210d3d634) Thanks [@mattcosta7](https://github.com/mattcosta7)! - PageLayout: Optimize drag/resize performance with inline styles and new optimizations + + **Refactored:** + + - Use direct attribute selectors (`.Pane[data-dragging='true']`) instead of descendant selectors for CSS containment (O(1) vs O(n) selector matching) + - Extract optimization utilities to `paneUtils.ts` + - Apply drag handle visual feedback via inline styles and CSS variables + + **Added:** + + - `content-visibility: auto` during drag/resize to skip off-screen content rendering + - rAF throttle for drag updates (one update per frame, latest position wins) + - Containment during window resize (parity with drag) + + These changes improve style recalculation performance on large DOMs (100k+ nodes) by eliminating descendant selector traversal. + +- [#7337](https://github.com/primer/react/pull/7337) [`de970d6`](https://github.com/primer/react/commit/de970d6682f4e9a3aa5e3c637e0245da2a7a9d84) Thanks [@mattcosta7](https://github.com/mattcosta7)! - perf(Autocomplete): Split context to reduce unnecessary re-renders + + Split AutocompleteContext into separate contexts for static values, setters, and dynamic state. + Components now subscribe only to the context slices they need, reducing re-renders. + +- [#7325](https://github.com/primer/react/pull/7325) [`cc7e10e`](https://github.com/primer/react/commit/cc7e10e7c0bee7ef9694ca94928446f704ada552) Thanks [@mattcosta7](https://github.com/mattcosta7)! - perf(BaseStyles): Remove expensive :has([data-color-mode]) selectors + + Remove `:has([data-color-mode])` selectors that scanned the entire DOM on every style recalculation. + Input color-scheme is already handled by global selectors in the codebase. + +- [#7329](https://github.com/primer/react/pull/7329) [`501a41f`](https://github.com/primer/react/commit/501a41fc44e5c0edfca69af022676e0d26e1a1a0) Thanks [@mattcosta7](https://github.com/mattcosta7)! - perf(Dialog): Add feature flag for CSS :has() selector performance optimization + + - Add `primer_react_css_has_selector_perf` feature flag (default: false) + - When flag is OFF: uses legacy `body:has(.Dialog.DisableScroll)` selector + - When flag is ON: uses optimized direct `body[data-dialog-scroll-disabled]` data attribute with ref counting + - Enables gradual rollout and easy rollback of performance optimization + +- [#7342](https://github.com/primer/react/pull/7342) [`a8b42b2`](https://github.com/primer/react/commit/a8b42b2e4cff9575eae8df897e64c1ca67ee180a) Thanks [@mattcosta7](https://github.com/mattcosta7)! - perf(hasInteractiveNodes): Optimize with combined selector and early attribute checks + + - Use combined querySelectorAll selector instead of recursive traversal + - Check attribute-based states (disabled, hidden, inert) before getComputedStyle + - Only call getComputedStyle when CSS-based visibility check is needed + ## 38.6.2 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 5bc08e3812c..c47fec411be 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,7 +1,7 @@ { "name": "@primer/react", "type": "module", - "version": "38.6.2", + "version": "38.7.0", "description": "An implementation of GitHub's Primer Design System using React", "main": "./dist/index.js", "module": "./dist/index.js",