Automatically fold and unfold styled-components blocks in your React/TypeScript code.
No more manual folding every time you open a file — keep your editor clean and focused. ✨
🚀 Features
Fold all styled-components in the current file with one command.
Unfold all styled-components instantly.
Default keybinding:
Ctrl + Alt + F → Fold all
Works with .tsx, .ts, .jsx, and .js files.
🖥️ Demo
📦 Installation
Open VS Code
Go to Extensions (Ctrl+Shift+X)
Search for Styled Component Folder
Install and reload
Or install from CLI:
code --install-extension PiyushSingh.styled-component-folder
⌨️ Usage
Open a file containing styled-components.
Run the command palette (Ctrl+Shift+P), then type:
Styled Components: Fold All
Styled Components: Unfold All
Or use the shortcut:
Ctrl + Alt + F → Fold All
🔧 Configuration
Currently none. Lightweight and simple by design.
🤝 Contributing
Issues and pull requests are welcome!
If you’d like to add features (like auto-fold on file open), fork the repo and submit a PR.
📜 License
MIT
Made with ❤️ by Piyush Singh(workspace.piyush01@gmail.com)