Skip to content
| Marketplace
Sign in
Visual Studio Code>Snippets>WordPress Components SnippetsNew to Visual Studio Code? Get it now.
WordPress Components Snippets

WordPress Components Snippets

itsjonq

|
5,319 installs
| (0) | Free
WordPress React component snippets, from @wordpress/components.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

✂️ WordPress Components Snippets

Version

Handy code snippets for @wordpress/components

WordPress components snippets demo

Development

First, we need to install some dependencies. This project uses a couple of dependencies to generate the snippets.

Clone the repo to your computer, and run the command:

npm install

"Snip" Files

The snippets live in the data/ directory as .snip files. These files are use front-matter to store data about the component. The body contains the markup the generator(s) use to create the snippets.

Building

To build the snippets, run the command:

npm run build

Publishing

Run the following command with patch, minor, or major:

npm version patch

Snippets

Snippet Component
wp-animate @wordpress/components/animate
wp-autocomplete @wordpress/components/autocomplete
wp-base-control @wordpress/components/base-control
wp-button-group @wordpress/components/button-group
wp-button @wordpress/components/button
wp-checkbox-control @wordpress/components/checkbox-control
wp-clipboard-button @wordpress/components/clipboard-button
wp-color-indicator @wordpress/components/color-indicator
wp-color-palette @wordpress/components/color-palette
wp-color-picker @wordpress/components/color-picker
wp-dashicon @wordpress/components/dashicon
wp-date-time-picker @wordpress/components/date-time-picker
wp-disabled @wordpress/components/disabled
wp-draggable @wordpress/components/draggable
wp-dropdown-menu @wordpress/components/dropdown-menu
wp-dropdown @wordpress/components/dropdown
wp-dropzone @wordpress/components/dropzone
wp-external-link @wordpress/components/external-link
wp-focal-point-picker @wordpress/components/focal-point-picker
wp-focusable-iframe @wordpress/components/focusable-iframe
wp-font-size-picker @wordpress/components/font-size-picker
wp-form-file-upload @wordpress/components/form-file-upload
wp-form-toggle @wordpress/components/form-toggle
wp-form-token-field @wordpress/components/form-token-field
wp-icon-button @wordpress/components/icon-button
wp-icon @wordpress/components/icon
wp-isolated-event-container @wordpress/components/isolated-event-container
wp-keyboard-shortcuts @wordpress/components/keyboard-shortcuts
wp-menu-group @wordpress/components/menu-group
wp-menu-item-choice @wordpress/components/menu-item-choice
wp-menu-item @wordpress/components/menu-item
wp-modal @wordpress/components/modal
wp-navigable-container @wordpress/components/navigable-container
wp-notice @wordpress/components/notice
wp-panel @wordpress/components/panel
wp-placeholder @wordpress/components/placeholder
wp-popover @wordpress/components/popover
wp-query-controls @wordpress/components/query-controls
wp-radio-control @wordpress/components/radio-control
wp-resizable-box @wordpress/components/resizable-box
wp-responsive-wrapper @wordpress/components/responsive-wrapper
wp-sandbox @wordpress/components/sandbox
wp-scrolllock @wordpress/components/scrolllock
wp-select-control @wordpress/components/select-control
wp-slot-fill @wordpress/components/slot-fill
wp-snackbar @wordpress/components/snackbar
wp-spinner @wordpress/components/spinner
wp-tab-panel @wordpress/components/tab-panel
wp-text-control @wordpress/components/text-control
wp-textarea-control @wordpress/components/textarea-control
wp-toggle-control @wordpress/components/toggle-control
wp-toolbar @wordpress/components/toolbar
wp-tooltip @wordpress/components/tooltip
wp-tree-select @wordpress/components/tree-select
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft