https://github.com/itsjonq/wordpress-components-snippets
✂️ Handy code snippets for @wordpress/components
https://github.com/itsjonq/wordpress-components-snippets
Last synced: about 1 year ago
JSON representation
✂️ Handy code snippets for @wordpress/components
- Host: GitHub
- URL: https://github.com/itsjonq/wordpress-components-snippets
- Owner: ItsJonQ
- Created: 2019-08-27T01:28:46.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2019-08-27T15:27:12.000Z (almost 7 years ago)
- Last Synced: 2025-04-10T10:59:29.834Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 885 KB
- Stars: 5
- Watchers: 0
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ✂️ WordPress Components Snippets
[](https://marketplace.visualstudio.com/items?itemName=itsjonq.wordpress-components-snippets)
> Handy code snippets for @wordpress/components

## 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](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/animate) |
| `wp-autocomplete` | [@wordpress/components/autocomplete](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/autocomplete) |
| `wp-base-control` | [@wordpress/components/base-control](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/base-control) |
| `wp-button-group` | [@wordpress/components/button-group](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/button-group) |
| `wp-button` | [@wordpress/components/button](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/button) |
| `wp-checkbox-control` | [@wordpress/components/checkbox-control](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/checkbox-control) |
| `wp-clipboard-button` | [@wordpress/components/clipboard-button](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/clipboard-button) |
| `wp-color-indicator` | [@wordpress/components/color-indicator](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/color-indicator) |
| `wp-color-palette` | [@wordpress/components/color-palette](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/color-palette) |
| `wp-color-picker` | [@wordpress/components/color-picker](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/color-picker) |
| `wp-dashicon` | [@wordpress/components/dashicon](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/dashicon) |
| `wp-date-time-picker` | [@wordpress/components/date-time-picker](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/date-time-picker) |
| `wp-disabled` | [@wordpress/components/disabled](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/disabled) |
| `wp-draggable` | [@wordpress/components/draggable](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/draggable) |
| `wp-dropdown-menu` | [@wordpress/components/dropdown-menu](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/dropdown-menu) |
| `wp-dropdown` | [@wordpress/components/dropdown](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/dropdown) |
| `wp-dropzone` | [@wordpress/components/dropzone](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/dropzone) |
| `wp-external-link` | [@wordpress/components/external-link](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/external-link) |
| `wp-focal-point-picker` | [@wordpress/components/focal-point-picker](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/focal-point-picker) |
| `wp-focusable-iframe` | [@wordpress/components/focusable-iframe](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/focusable-iframe) |
| `wp-font-size-picker` | [@wordpress/components/font-size-picker](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/font-size-picker) |
| `wp-form-file-upload` | [@wordpress/components/form-file-upload](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/form-file-upload) |
| `wp-form-toggle` | [@wordpress/components/form-toggle](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/form-toggle) |
| `wp-form-token-field` | [@wordpress/components/form-token-field](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/form-token-field) |
| `wp-icon-button` | [@wordpress/components/icon-button](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/icon-button) |
| `wp-icon` | [@wordpress/components/icon](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/icon) |
| `wp-isolated-event-container` | [@wordpress/components/isolated-event-container](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/isolated-event-container) |
| `wp-keyboard-shortcuts` | [@wordpress/components/keyboard-shortcuts](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/keyboard-shortcuts) |
| `wp-menu-group` | [@wordpress/components/menu-group](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/menu-group) |
| `wp-menu-item-choice` | [@wordpress/components/menu-item-choice](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/menu-item-choice) |
| `wp-menu-item` | [@wordpress/components/menu-item](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/menu-item) |
| `wp-modal` | [@wordpress/components/modal](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/modal) |
| `wp-navigable-container` | [@wordpress/components/navigable-container](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/navigable-container) |
| `wp-notice` | [@wordpress/components/notice](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/notice) |
| `wp-panel` | [@wordpress/components/panel](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/panel) |
| `wp-placeholder` | [@wordpress/components/placeholder](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/placeholder) |
| `wp-popover` | [@wordpress/components/popover](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/popover) |
| `wp-query-controls` | [@wordpress/components/query-controls](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/query-controls) |
| `wp-radio-control` | [@wordpress/components/radio-control](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/radio-control) |
| `wp-resizable-box` | [@wordpress/components/resizable-box](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/resizable-box) |
| `wp-responsive-wrapper` | [@wordpress/components/responsive-wrapper](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/responsive-wrapper) |
| `wp-sandbox` | [@wordpress/components/sandbox](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/sandbox) |
| `wp-scrolllock` | [@wordpress/components/scrolllock](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/scrolllock) |
| `wp-select-control` | [@wordpress/components/select-control](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/select-control) |
| `wp-slot-fill` | [@wordpress/components/slot-fill](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/slot-fill) |
| `wp-snackbar` | [@wordpress/components/snackbar](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/snackbar) |
| `wp-spinner` | [@wordpress/components/spinner](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/spinner) |
| `wp-tab-panel` | [@wordpress/components/tab-panel](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/tab-panel) |
| `wp-text-control` | [@wordpress/components/text-control](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/text-control) |
| `wp-textarea-control` | [@wordpress/components/textarea-control](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/textarea-control) |
| `wp-toggle-control` | [@wordpress/components/toggle-control](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/toggle-control) |
| `wp-toolbar` | [@wordpress/components/toolbar](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/toolbar) |
| `wp-tooltip` | [@wordpress/components/tooltip](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/tooltip) |
| `wp-tree-select` | [@wordpress/components/tree-select](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/tree-select) |