Merge branch 'main' into ktravers/rm-sx-from-tree-view

primer · Nov 14, 2024 · 919f426 · 919f426
2 parents bdd9ffd + aac10fa
commit 919f426
Show file tree

Hide file tree

Showing 38 changed files with 88 additions and 53 deletions.
diff --git a/.changeset/brave-cheetahs-prove.md b/.changeset/brave-cheetahs-prove.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Move Select component from team to staff flag
diff --git a/.changeset/calm-meals-impress.md b/.changeset/calm-meals-impress.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Move CounterLabel CSS module feature flag from staff to ga 
diff --git a/.changeset/chilled-goats-visit.md b/.changeset/chilled-goats-visit.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Move Spinner component from team to staff flag
diff --git a/.changeset/clean-coats-lie.md b/.changeset/clean-coats-lie.md
diff --git a/.changeset/clean-ligers-approve.md b/.changeset/clean-ligers-approve.md
diff --git a/.changeset/cyan-lions-itch.md b/.changeset/cyan-lions-itch.md
diff --git a/.changeset/erken-gelen-oturur.md b/.changeset/erken-gelen-oturur.md
diff --git a/.changeset/five-hornets-agree.md b/.changeset/five-hornets-agree.md
diff --git a/.changeset/grumpy-cherries-deny.md b/.changeset/grumpy-cherries-deny.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Move Details component from team to staff flag
diff --git a/.changeset/honest-plums-approve.md b/.changeset/honest-plums-approve.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Move Header component from team to staff flag
diff --git a/.changeset/late-swans-knock.md b/.changeset/late-swans-knock.md
diff --git a/.changeset/new-donkeys-attend.md b/.changeset/new-donkeys-attend.md
diff --git a/.changeset/polite-ligers-exercise.md b/.changeset/polite-ligers-exercise.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+chore(ButtonGroup): Move ButtonGroup CSS module feature flag from staff to ga 
diff --git a/.changeset/tricky-ways-tan.md b/.changeset/tricky-ways-tan.md
diff --git a/...nents/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-colorblind-linux.png b/...nents/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-colorblind-linux.png
diff --git a/...omponents/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-dimmed-linux.png b/...omponents/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-dimmed-linux.png
diff --git a/...ts/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-high-contrast-linux.png b/...ts/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-high-contrast-linux.png
diff --git a/...shots/components/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-linux.png b/...shots/components/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-linux.png
diff --git a/...nents/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-tritanopia-linux.png b/...nents/Textarea.test.ts-snapshots/Textarea-Dev-Default-dark-tritanopia-linux.png
diff --git a/...ents/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-colorblind-linux.png b/...ents/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-colorblind-linux.png
diff --git a/...s/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-high-contrast-linux.png b/...s/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-high-contrast-linux.png
diff --git a/...hots/components/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-linux.png b/...hots/components/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-linux.png
diff --git a/...ents/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-tritanopia-linux.png b/...ents/Textarea.test.ts-snapshots/Textarea-Dev-Default-light-tritanopia-linux.png
diff --git a/e2e/components/Textarea.test.ts b/e2e/components/Textarea.test.ts
@@ -43,6 +43,10 @@ const stories = [
     id: 'components-textarea-features--custom-width',
     title: 'Custom Width',
   },
+  {
+    id: 'components-textarea-dev--dev-default',
+    title: 'Dev Default',
+  },
 ] as const
 
 test.describe('Textarea', () => {

diff --git a/examples/app-router/package.json b/examples/app-router/package.json
@@ -10,7 +10,7 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "@primer/react": "37.4.0",
+    "@primer/react": "37.5.0",
     "next": "^14.2.10",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",

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

diff --git a/examples/consumer-test/package.json b/examples/consumer-test/package.json
@@ -9,7 +9,7 @@
     "@types/react": "^18.3.11",
     "@types/react-dom": "^18.2.19",
     "@types/styled-components": "^5.1.11",
-    "@primer/react": "37.4.0",
+    "@primer/react": "37.5.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "styled-components": "^5.3.11",

diff --git a/examples/theming/package.json b/examples/theming/package.json
@@ -11,7 +11,7 @@
   },
   "dependencies": {
     "@primer/octicons-react": "^19.9.0",
-    "@primer/react": "37.4.0",
+    "@primer/react": "37.5.0",
     "clsx": "^1.2.1",
     "next": "^14.2.10",
     "react": "^18.3.1",

diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md
@@ -1,5 +1,29 @@
 # @primer/react
 
+## 37.5.0
+
+### Minor Changes
+
+- [#5253](https://github.com/primer/react/pull/5253) [`729c0fa`](https://github.com/primer/react/commit/729c0fac9a8d84f20bb77c046063837b38e90d37) Thanks [@hussam-i-am](https://github.com/hussam-i-am)! - Deprecate width, minWidth and maxWidth props from TextInput
+
+- [#5169](https://github.com/primer/react/pull/5169) [`a2efba0`](https://github.com/primer/react/commit/a2efba0079304e25dd700523dbfa35fab56249ad) Thanks [@francinelucca](https://github.com/francinelucca)! - fix(ActionList): do not truncate description by default
+
+- [#5254](https://github.com/primer/react/pull/5254) [`ac6ddcd`](https://github.com/primer/react/commit/ac6ddcd4b15526dd6f5ad6072a4daa57087eb1e7) Thanks [@hussam-i-am](https://github.com/hussam-i-am)! - Convert UnstyledTextInput to use CSS Modules behing feature flag
+
+- [#5246](https://github.com/primer/react/pull/5246) [`c4ecb73`](https://github.com/primer/react/commit/c4ecb7312c1f595361a6b5a247c73af894c0be54) Thanks [@keithamus](https://github.com/keithamus)! - Migrate DialogV1 to CSS Modules
+
+### Patch Changes
+
+- [#5277](https://github.com/primer/react/pull/5277) [`a9088e6`](https://github.com/primer/react/commit/a9088e60b6f60ee13e309b7c263def781caba97e) Thanks [@langermank](https://github.com/langermank)! - Fix `TreeViewItem` folder icon color in legacy fallback theme + update VRT
+
+- [#4745](https://github.com/primer/react/pull/4745) [`3f508c7`](https://github.com/primer/react/commit/3f508c7778839a8bfd659adcb21a1eda558e0f0a) Thanks [@cihad](https://github.com/cihad)! - UnderlineNav: Display loading counters only for items with the "counter" prop.
+
+- [#5283](https://github.com/primer/react/pull/5283) [`d6ea909`](https://github.com/primer/react/commit/d6ea909eb3ef8c2ae178ee590865b80108fa3390) Thanks [@jonrohan](https://github.com/jonrohan)! - Move VisuallyHidden component from team to staff flag
+
+- [#5292](https://github.com/primer/react/pull/5292) [`d3959f3`](https://github.com/primer/react/commit/d3959f3685bcf8aff908efe69cbf80c92c85483c) Thanks [@jonrohan](https://github.com/jonrohan)! - Move Stack component from team to staff flag
+
+- [#5280](https://github.com/primer/react/pull/5280) [`973130e`](https://github.com/primer/react/commit/973130e9119e1f592345d3e67c1b61f37957191b) Thanks [@jonrohan](https://github.com/jonrohan)! - Move Checkbox CSS module feature flag from staff to ga
+
 ## 37.4.0
 
 ### Minor Changes

diff --git a/packages/react/package.json b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@primer/react",
-  "version": "37.4.0",
+  "version": "37.5.0",
   "description": "An implementation of GitHub's Primer Design System using React",
   "main": "lib/index.js",
   "module": "lib-esm/index.js",

diff --git a/packages/react/src/ButtonGroup/ButtonGroup.tsx b/packages/react/src/ButtonGroup/ButtonGroup.tsx
@@ -12,7 +12,7 @@ import {useProvidedRefOrCreate} from '../hooks'
 import type {ForwardRefComponent as PolymorphicForwardRefComponent} from '../utils/polymorphic'
 
 const StyledButtonGroup = toggleStyledComponent(
-  'primer_react_css_modules_staff',
+  'primer_react_css_modules_ga',
   'div',
   styled.div`
     display: inline-flex;
@@ -82,7 +82,7 @@ const ButtonGroup = React.forwardRef<HTMLElement, ButtonGroupProps>(function But
   {children, className, role, ...rest},
   forwardRef,
 ) {
-  const enabled = useFeatureFlag('primer_react_css_modules_staff')
+  const enabled = useFeatureFlag('primer_react_css_modules_ga')
   const buttonRef = useProvidedRefOrCreate(forwardRef as React.RefObject<HTMLDivElement>)
 
   useFocusZone({

diff --git a/packages/react/src/CounterLabel/CounterLabel.tsx b/packages/react/src/CounterLabel/CounterLabel.tsx
@@ -20,7 +20,7 @@ export type CounterLabelProps = React.PropsWithChildren<
 
 const CounterLabel = forwardRef<HTMLSpanElement, CounterLabelProps>(
   ({scheme = 'secondary', sx = defaultSxProp, className, children, ...rest}, forwardedRef) => {
-    const enabled = useFeatureFlag('primer_react_css_modules_staff')
+    const enabled = useFeatureFlag('primer_react_css_modules_ga')
     const label = <VisuallyHidden>&nbsp;({children})</VisuallyHidden>
     const counterProps = {
       ref: forwardedRef,

diff --git a/packages/react/src/Details/Details.tsx b/packages/react/src/Details/Details.tsx
@@ -8,7 +8,7 @@ import {clsx} from 'clsx'
 import classes from './Details.module.css'
 import {useMergedRefs} from '../internal/hooks/useMergedRefs'
 
-const CSS_MODULES_FEATURE_FLAG = 'primer_react_css_modules_team'
+const CSS_MODULES_FEATURE_FLAG = 'primer_react_css_modules_staff'
 
 const StyledDetails = toggleStyledComponent(
   CSS_MODULES_FEATURE_FLAG,

diff --git a/packages/react/src/Header/Header.tsx b/packages/react/src/Header/Header.tsx
@@ -15,7 +15,7 @@ type StyledHeaderProps = React.ComponentProps<'header'> & SxProp
 type StyledHeaderItemProps = React.ComponentProps<'div'> & SxProp & {full?: boolean}
 type StyledHeaderLinkProps = React.ComponentProps<'a'> & SxProp & {to?: Location | Pathname}
 
-const CSS_MODULES_FEATURE_FLAG = 'primer_react_css_modules_team'
+const CSS_MODULES_FEATURE_FLAG = 'primer_react_css_modules_staff'
 
 const StyledHeader = toggleStyledComponent(
   CSS_MODULES_FEATURE_FLAG,

diff --git a/packages/react/src/Select/Select.tsx b/packages/react/src/Select/Select.tsx
@@ -14,7 +14,7 @@ export type SelectProps = Omit<
   placeholder?: string
 }
 
-const CSS_MODULES_FEATURE_FLAG = 'primer_react_css_modules_team'
+const CSS_MODULES_FEATURE_FLAG = 'primer_react_css_modules_staff'
 
 const arrowRightOffset = '4px'
 

diff --git a/packages/react/src/Spinner/Spinner.tsx b/packages/react/src/Spinner/Spinner.tsx
@@ -92,7 +92,7 @@ const StyledBaseSpinner = styled.div`
 `
 
 function StyledSpinner({sx, className, ...props}: SpinnerProps) {
-  const enabled = useFeatureFlag('primer_react_css_modules_team')
+  const enabled = useFeatureFlag('primer_react_css_modules_staff')
   if (enabled) {
     if (sx) {
       return <StyledBaseSpinner sx={sx} as={Spinner} className={clsx(className, classes.SpinnerAnimation)} {...props} />

diff --git a/packages/react/src/Stack/Stack.tsx b/packages/react/src/Stack/Stack.tsx
@@ -7,7 +7,7 @@ import {toggleStyledComponent} from '../internal/utils/toggleStyledComponent'
 import {useFeatureFlag} from '../FeatureFlags'
 import {clsx} from 'clsx'
 
-const CSS_MODULE_FEATURE_FLAG = 'primer_react_css_modules_team'
+const CSS_MODULE_FEATURE_FLAG = 'primer_react_css_modules_staff'
 
 const StyledStack = toggleStyledComponent(
   CSS_MODULE_FEATURE_FLAG,

diff --git a/packages/react/src/Textarea/Textarea.dev.stories.tsx b/packages/react/src/Textarea/Textarea.dev.stories.tsx
@@ -0,0 +1,17 @@
+import React from 'react'
+import type {Meta} from '@storybook/react'
+import {Box, FormControl, Textarea} from '..'
+
+export default {
+  title: 'Components/Textarea/Dev',
+  component: Textarea,
+} as Meta
+
+export const DevDefault = () => (
+  <Box as="form">
+    <FormControl>
+      <FormControl.Label>Default label</FormControl.Label>
+      <Textarea sx={{backgroundColor: 'darkgreen'}} style={{color: 'white'}} value="foo" />
+    </FormControl>
+  </Box>
+)