Skip to content

Components: Remove Jetpack overriding styles#47056

Open
keoshi wants to merge 14 commits intotrunkfrom
remove/jetpack-overriding-styles-components
Open

Components: Remove Jetpack overriding styles#47056
keoshi wants to merge 14 commits intotrunkfrom
remove/jetpack-overriding-styles-components

Conversation

@keoshi
Copy link
Contributor

@keoshi keoshi commented Feb 11, 2026 •
edited
Loading

Draft PR, DO NOT MERGE

Fixes #

Proposed changes:

  • Global: Remove Jetpack styling overrides on components (toggle).
  • Search: Replace custom toggles for WP components.

Other information:

  • Have you written new tests for your changes, if applicable?
  • Have you checked the E2E test CI results, and verified that your changes do not break them?
  • Have you tested your changes on WordPress.com, if applicable (if so, you'll see a generated comment below with a script to run)?

Jetpack product discussion

Does this pull request change what data or activity we track or use?

Testing instructions:

  • Go to '..'

@keoshi keoshi self-assigned this Feb 11, 2026
@keoshi keoshi added the DO NOT MERGE don't merge it! label Feb 11, 2026
@github-actions
Copy link
Contributor

github-actions bot commented Feb 11, 2026 •
edited
Loading

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

  • To test on WoA, go to the Plugins menu on a WoA dev site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack Beta plugin. Once the plugin is active, go to Jetpack > Jetpack Beta, select your plugin (Jetpack or WordPress.com Site Helper), and enable the remove/jetpack-overriding-styles-components branch.
  • To test on Simple, run the following command on your sandbox:
bin/jetpack-downloader test jetpack remove/jetpack-overriding-styles-components

bin/jetpack-downloader test jetpack-mu-wpcom-plugin remove/jetpack-overriding-styles-components

Interested in more tips and information?

  • In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
  • Read more about our development workflow here: PCYsg-eg0-p2
  • Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

@github-actions github-actions bot added [Feature] Publicize Now Jetpack Social, auto-sharing [JS Package] Components [Package] My Jetpack [Package] Publicize [Plugin] Automattic For Agencies Client [Plugin] Backup A plugin that allows users to save every change and get back online quickly with one-click restores. [Plugin] Boost A feature to speed up the site and improve performance. [Plugin] Classic Theme Helper Plugin [Plugin] CRM Issues about the Jetpack CRM plugin [Plugin] Inspect [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ [Plugin] mu wpcom jetpack-mu-wpcom plugin [Plugin] Paypal Payment Buttons [Plugin] Protect A plugin with features to protect a site: brute force protection, security scanning, and a WAF. [Plugin] Search A plugin to add an instant search modal to your site to help visitors find content faster. [Plugin] Social Issues about the Jetpack Social plugin [Plugin] Starter Plugin [Plugin] VideoPress A standalone plugin to add high-quality VideoPress videos to your site. [Plugin] Wpcloud Sso [Plugin] Wpcomsh RNA labels Feb 11, 2026
@github-actions
Copy link
Contributor

github-actions bot commented Feb 11, 2026 •
edited
Loading

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

  • ✅ Include a description of your PR changes.
  • 🔴 Add a "[Status]" label (In Progress, Needs Review, ...).
  • ✅ Add testing instructions.
  • ✅ Specify whether this PR includes any changes to data or privacy.
  • ✅ Add changelog entries to affected projects

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

Follow this PR Review Process:

  1. Ensure all required checks appearing at the bottom of this PR are passing.
  2. Make sure to test your changes on all platforms that it applies to. You're responsible for the quality of the code you ship.
  3. You can use GitHub's Reviewers functionality to request a review.
  4. When it's reviewed and merged, you will be pinged in Slack to deploy the changes to WordPress.com simple once the build is done.

If you have questions about anything, reach out in #jetpack-developers for guidance!

Jetpack plugin:

The Jetpack plugin has different release cadences depending on the platform:

  • WordPress.com Simple releases happen as soon as you deploy your changes after merging this PR (PCYsg-Jjm-p2).
  • WoA releases happen weekly.
  • Releases to self-hosted sites happen monthly:
    • Scheduled release: March 3, 2026
    • Code freeze: March 3, 2026

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Backup plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Boost plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Search plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Social plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Starter Plugin plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Protect plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Videopress plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Mu Wpcom plugin:

  • Next scheduled release: WordPress.com Simple releases happen semi-continuously (PCYsg-Jjm-p2)

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Inspect plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Wpcomsh plugin:

  • Next scheduled release: Atomic deploys happen twice daily on weekdays (p9o2xV-2EN-p2)

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Automattic For agencies client plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Classic Theme helper plugin plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Paypal Payment buttons plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Wpcloud Sso plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

@github-actions github-actions bot added the [Status] Needs Author Reply We need more details from you. This label will be auto-added until the PR meets all requirements. label Feb 11, 2026
@jp-launch-control
Copy link

jp-launch-control bot commented Feb 11, 2026 •
edited
Loading

Code Coverage Summary

Coverage changed in 2 files.

File Coverage Δ% Δ Uncovered
projects/plugins/jetpack/_inc/client/performance/search.jsx 13/23 (56.52%) -1.81% 0 💚
projects/plugins/jetpack/_inc/client/performance/speed-up-site.jsx 0/59 (0.00%) 0.00% -19 💚

Full summary · PHP report · JS report

@keoshi @claude
Search: replace custom FormToggle with WordPress ToggleControl
c91da87 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@github-actions github-actions bot added [Package] Search Contains core Search functionality for Jetpack and Search plugins [Tests] Includes Tests Docs E2E Tests labels Feb 11, 2026
simison
simison reviewed Feb 11, 2026
View reviewed changes
projects/packages/my-jetpack/_inc/components/my-jetpack-tab-panel/styles.module.scss
@@ -1 +1 @@
@use "@automattic/jetpack-base-styles/gutenberg-base-styles" as gb;
Copy link
Member

@simison simison Feb 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Jetpack Tabs we could look at replacing with @wordpress/ui.Tabs pretty soon.

Copy link
Contributor

@DevinWalker DevinWalker Feb 12, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That would be the vision across a lot of components

Copy link
Contributor Author

@keoshi keoshi Feb 12, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's going to be addressed when unifying the header, no?

simison
simison reviewed Feb 11, 2026
View reviewed changes
projects/packages/search/src/dashboard/components/module-control/index.jsx
import analytics from '@automattic/jetpack-analytics';
import { getProductCheckoutUrl } from '@automattic/jetpack-components';
import { useConnection } from '@automattic/jetpack-connection';
import { ToggleControl } from '@wordpress/components';
Copy link
Member

@simison simison Feb 11, 2026 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it make sense to keep one PR in green-colour removals and then separate PR (either merged before this or after) on more substantial component-switcheroo?

Just because this will require more thorough functional testing, vs just visual.

Copy link
Contributor

@DevinWalker DevinWalker Feb 12, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Go big or go home

@keoshi
Components: remove custom ToggleControl wrapper, use core component d…
a97b1cb 
…irectly

Deleted:
  - projects/js-packages/components/components/toggle-control/ (entire directory — index.tsx, styles.module.scss, README.md, stories/)

  Removed export:
  - projects/js-packages/components/index.ts — removed ToggleControl export

  Updated 23 consumer files — changed ToggleControl import from @automattic/jetpack-components to @wordpress/components:
  - 5 traffic files (seo, related-posts, site-stats, blaze, google-analytics)
  - 3 security files (allowList, waf, sso)
  - 3 performance files (search, speed-up-site, media)
  - 2 newsletter files (subscriptions-settings, newsletter-categories)
  - 1 earn file (ads)
  - 1 component (module-toggle)
  - 3 writing files (writing-media, custom-content-types, comments) — done by subagent
  - 2 publicize files (social-image-generator/toggle, utm-toggle)
  - 1 CRM file (workflow-row)
  - 1 Boost file (module.tsx)
  - 1 Protect file (firewall-footer.jsx)

  Removed custom props from call sites:
  - toggling={...} removed from all direct <ToggleControl> usages (~30 instances across 12 files)
  - size="small" removed from Boost and Protect (3 instances)
  - Merged duplicate @wordpress/components imports in 2 files
@github-actions github-actions bot added the Admin Page React-powered dashboard under the Jetpack menu label Feb 13, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@simison simison simison left review comments

@DevinWalker DevinWalker DevinWalker left review comments

Assignees

@keoshi keoshi

Labels

Admin Page React-powered dashboard under the Jetpack menu DO NOT MERGE don't merge it! Docs E2E Tests [Feature] Publicize Now Jetpack Social, auto-sharing [JS Package] Components [Package] My Jetpack [Package] Publicize [Package] Search Contains core Search functionality for Jetpack and Search plugins [Plugin] Automattic For Agencies Client [Plugin] Backup A plugin that allows users to save every change and get back online quickly with one-click restores. [Plugin] Boost A feature to speed up the site and improve performance. [Plugin] Classic Theme Helper Plugin [Plugin] CRM Issues about the Jetpack CRM plugin [Plugin] Inspect [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ [Plugin] mu wpcom jetpack-mu-wpcom plugin [Plugin] Paypal Payment Buttons [Plugin] Protect A plugin with features to protect a site: brute force protection, security scanning, and a WAF. [Plugin] Search A plugin to add an instant search modal to your site to help visitors find content faster. [Plugin] Social Issues about the Jetpack Social plugin [Plugin] Starter Plugin [Plugin] VideoPress A standalone plugin to add high-quality VideoPress videos to your site. [Plugin] Wpcloud Sso [Plugin] Wpcomsh RNA [Status] Needs Author Reply We need more details from you. This label will be auto-added until the PR meets all requirements. [Tests] Includes Tests

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@keoshi @simison @DevinWalker