Remove styled-system usage - TextInputWrapper and related

[mperrotti]

Relates to https://github.com/github/primer/issues/5422

Changelog

New

Changed

Removed

Note

Reviewers: I misunderstood the scope of https://github.com/github/primer/issues/5422 when I started on it and also removed sx props. If we want to preserve those for now, I can revert those changes.

• sx prop from
  • Select
  • Textarea
  • TextInput
  • TextInputWithTokens
  • TextInputWrapper
• width, minWidth, and maxWidth props from TextInputWrapper
• styled-system dependencies

Rollout strategy

• Patch release
• Minor release
• Major release; if selected, include a written rollout or migration plan
• None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Storybook)
• Changes are SSR compatible
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge
• (GitHub staff only) Integration tests pass at github/github (Learn more about how to run integration tests)

[changeset-bot]

🦋 Changeset detected

Latest commit: eb29047

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@primer/react	Major
@primer/styled-react	Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

[github-actions]

size-limit report 📦

Path	Size
packages/react/dist/browser.esm.js	89.49 KB (-0.13% 🔽)
packages/react/dist/browser.umd.js	89.5 KB (-0.22% 🔽)

[Copilot]

Pull Request Overview

This pull request removes styled-system usage from TextInputWrapper and related input components as part of the migration away from styled-system dependencies. The changes eliminate the sx prop and width-related props from multiple input components and their wrapper.

• Removes styled-system imports and SxProp usage from input components
• Eliminates deprecated width, minWidth, and maxWidth props from TextInputWrapper
• Updates component type definitions to remove styled-system prop references

Reviewed Changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
packages/react/src/internal/components/TextInputWrapper.tsx	Removes styled-system imports, width props, and sx prop from TextInputBaseWrapper
packages/react/src/Textarea/Textarea.tsx	Removes SxProp import and sx prop usage
packages/react/src/TextInputWithTokens/TextInputWithTokens.tsx	Removes sx and width-related props from component
packages/react/src/TextInput/TextInput.tsx	Removes sx and width props from TextInput component and type definitions
packages/react/src/TextInput/TextInput.docs.json	Removes documentation for deprecated width-related props
packages/react/src/TextInput/TextInput.dev.stories.tsx	Replaces sx prop usage with CSS classes and updates story structure
packages/react/src/Select/Select.tsx	Removes sx prop usage from Select component
packages/react/src/Overlay/Overlay.features.stories.tsx	Migrates from sx props to CSS modules and semantic components
packages/react/src/Overlay/Overlay.features.stories.module.css	Adds CSS module styles to replace inline sx styling
.changeset/gold-dingos-sneeze.md	Documents the major version change for removing styled-system usage

Comments suppressed due to low confidence (1)

packages/react/src/internal/components/TextInputWrapper.tsx:1

• The style prop is being destructured from props but removed from the component signature. This will cause the prop to be included in restProps and passed to the underlying component, but it's no longer in the type definition. Either remove it from destructuring or add it back to the type definition.

import React, {type ComponentProps} from 'react'

[primer-integration]

👋 Hi from github/github-ui! Your integration PR is ready: https://github.com/github/github-ui/pull/2381

[primer-integration]

🔴 ci completed with status failure.