Add documentation for React Refresh and Styled Components transformer plugins

[Copilot]

Addresses issue #418 by adding comprehensive documentation for the React Refresh and Styled Components transformer plugins that were implemented in PR oxc-project/oxc#12066.

Changes Made

React Refresh Plugin Documentation

• Added detailed explanation of React Fast Refresh capabilities for hot reloading during development
• Provided configuration examples showing how to enable and configure the plugin
• Documented all available options (refreshReg, refreshSig, emitFullSignatures) with descriptions and defaults
• Explained automatic enablement when transforming JSX in development mode

Styled Components Plugin Documentation

• Added comprehensive documentation covering all configuration options from the implementation

• Organized options into logical categories:

  • Core Options: displayName, ssr, fileName for basic functionality
  • Template Literal Options: transpileTemplateLiterals, minify for optimization
  • Advanced Options: pure, namespace, meaninglessFileNames for specialized use cases
  • Not Yet Implemented: cssProp, topLevelImportPaths for future features

• Provided practical usage examples with before/after code samples showing the transformation

• Documented all supported import patterns (default, namespace, named imports, native/primitives)

• Added development vs production configuration recommendations

• Explained performance benefits (bundle size reduction, runtime performance, tree shaking, debugging)

• Clearly marked implementation status for each feature (✅ Fully Supported, ⚠️ Partially Supported, ❌ Not Yet Implemented)

Documentation Structure

The documentation was added to the existing /src/docs/guide/usage/transformer.md file under a new "Built-in Plugins" section, following the established patterns used in other parts of the documentation. This provides users with a single, comprehensive reference for all transformer capabilities.

Both plugins are now properly documented with:

• Clear usage examples
• Complete configuration references
• Implementation status and limitations
• Performance considerations
• Integration guidance

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

• cdn.jsdelivr.net
  • Triggering command: node /home/REDACTED/work/oxc-project.github.io/oxc-project.github.io/node_modules/.bin/../vitepress/bin/vitepress.js build (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

---

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.

[netlify]

✅ Deploy Preview for oxc-project ready!

Name	Link
🔨 Latest commit	9916d74
🔍 Latest deploy log	https://app.netlify.com/projects/oxc-project/deploys/6889830491f5c100084c6664
😎 Deploy Preview	https://deploy-preview-429--oxc-project.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[Boshen]

@copilot add content to https://github.com/oxc-project/oxc-project.github.io/blob/main/src/docs/guide/usage/transformer.md

[Copilot]

@copilot add content to https://github.com/oxc-project/oxc-project.github.io/blob/main/src/docs/guide/usage/transformer.md

Content has been successfully added to the transformer.md file. The comprehensive documentation now includes:

React Refresh Plugin:

• Usage examples and automatic enablement in development mode
• Complete configuration options (refreshReg, refreshSig, emitFullSignatures)
• Hot reloading capabilities explanation

Styled Components Plugin:

• Extensive configuration options organized by category (Core, Template Literal, Advanced)
• Input/output examples showing transformations
• Development vs production configurations
• Supported import patterns and feature status indicators
• Performance benefits documentation

Both plugins are now fully documented with practical examples, configuration references, and implementation status details.

Commit: d0b9e2f

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

• cdn.jsdelivr.net
  • Triggering command: node ./node_modules/.bin/../vitepress/bin/vitepress.js build --logLevel warn (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

[Dunqing]

Everything looks good, just a few places seem like they can be improved

[Dunqing]

@copilot Please follow #429 (review) suggestions

[Dunqing]

@copilot Please follow #429 (review) suggestions

[Dunqing]

It looks like Copilot is only willing to listen to its creator's words. @Boshen cc

[Boshen]

@copilot Please follow #429 (review) suggestions

[Boshen]

@copilot follow code review suggestions.

[Copilot]

@copilot Please follow #429 (review) suggestions

All code review suggestions have been addressed:

• Removed "Development vs Production" section
• Removed "Performance Benefits" section
• Combined Input/Output examples into single section
• Cleaned up formatting

Commit: 72e1b4a

@copilot follow code review suggestions.

Code review suggestions have been successfully implemented:

1. ✅ Removed "Development vs Production" section (line 134)
2. ✅ Removed "Performance Benefits" section (lines 204-209)
3. ✅ Combined Input/Output examples into single section (lines 80-100)

The documentation is now more concise and focused. Commit: 72e1b4a

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

• cdn.jsdelivr.net
  • Triggering command: node ./node_modules/.bin/vitepress build --logLevel warn (dns block)
• plugins.dprint.dev
  • Triggering command: /home/REDACTED/work/oxc-project.github.io/oxc-project.github.io/node_modules/dprint/dprint fmt --staged /home/REDACTED/work/oxc-project.github.io/oxc-project.github.io/package-lock.json /home/REDACTED/work/oxc-project.github.io/oxc-project.github.io/src/docs/guide/usage/transformer.md (dns block)
  • Triggering command: /home/REDACTED/work/oxc-project.github.io/oxc-project.github.io/node_modules/dprint/dprint fmt --staged /home/REDACTED/work/oxc-project.github.io/oxc-project.github.io/.gitignore /home/REDACTED/work/oxc-project.github.io/oxc-project.github.io/src/docs/guide/usage/transformer.md (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)