Questions tagged [react]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
0 votes
0 answers
15 views

How to dynamically add style tags to Gutenberg editor in react

Is there any way to add a dynamic style tag to the editor content area by react. The inner content will change by editing. Is any component or hook can use?
wewe_loohotmailcom's user avatar
0 votes
0 answers
24 views

Issue using useInnerBlocksProps for custom block

I am trying to create an image slider with useInnerBlocksProps but, I can not get it to work. I am able to get the block to work when using InnerBlocks, but this adds unnecessary div wraps. The ...
Onome's user avatar
  • 1
1 vote
1 answer
35 views

Working with a non-React external library in a custom block

I'm using the following code to be able to use the Panzoom JS lib in a custom block. This is a non-React library for panning and zooming elements using CSS transforms: edit: (props) => { ...
leemon's user avatar
  • 1,718
0 votes
1 answer
63 views

How can I include React useState in a custom gutenberg block plugin?

The block code is as such: wp.blocks.registerBlockType('myblocks/gallery', { title: 'Gallery', icon: 'my-gallery', category: 'common', attributes: { }, edit: props => { const [...
budgiebeaks's user avatar
0 votes
2 answers
320 views

'useSate' error when using React on the frontend in custom block plugin

I keep getting this error with React on the frontend Uncaught TypeError: Cannot read properties of null (reading 'useState') I'm trying to use this hamburger component (https://hamburger-react....
Shelaine's user avatar
0 votes
1 answer
48 views

Creating my own "recent blog posts" static Gutenberg block, can't use react hooks in the frontend

so I was trying to learn more about Gutenberg Blocks and I wanted to make a block that shows the last three blog posts - something that could be used at the bottom of each page of my Wordpress site. I ...
Mike Sav's user avatar
  • 105
1 vote
1 answer
108 views

How can I render a built-in Gutenberg block with InnerBlocks outside of the block editor?

I want to show my custom styling for some built-in blocks in my project's Storybook instance. I have it working great for simple blocks. To show the Paragraph block, I do this: Paragraph.stories.jsx: ...
75th Trombone's user avatar
0 votes
0 answers
28 views

How do i fix type error

i an getting an error in my react build online, even though it seems to be working fine locally. react-dom.production.min.js:189 TypeError: Cannot read properties of undefined (reading 'length') at VK ...
Mad Crowe's user avatar
0 votes
2 answers
56 views

Why is my Toggle field not showing in Gutenberg?

I am adding a PluginSidebar to Gutenberg and it works until I try to add a meta field to the sidebar. Then it doesn't work. I'm not sure why though. import { registerPlugin } from "@wordpress/...
JayDev95's user avatar
  • 157
1 vote
0 answers
61 views

How to add more elements to an already existing <PanelBody> section in Gutenberg

I am filtering core blocks to add more functionality and I know how I can create a new section in the sidebar that is opened by default like this: return ( <> ...
NextGenThemes's user avatar
0 votes
1 answer
75 views

React Plugin Settings Page Localization

I'm learning how to make plugins, and Thanks to Sally CJ managed to get translation working on the PHP files, and the Gutenberg Block... (If any need help on this check here ) But, I can't make it ...
Jorge's user avatar
  • 25
1 vote
1 answer
116 views

What is the standard way to use the version of React that ships with Gutenberg on the front end?

I want to create a Gutenberg block that uses React on the client rendered page (not the admin pages). Is React code split from the rest of Gutenberg? If so, how can I enqueue that specific bundled ...
lookyhooky's user avatar
0 votes
0 answers
203 views

What is the proper way of using React Hooks in Gutenberg on frontend?

I'm mostly interested in useState. It works fine in edit.js, but in save.js it just breaks and it throws the minified React error, see below: I tried creating a separate .jsx component file but it ...
Kerox's user avatar
  • 101
1 vote
3 answers
153 views

React Material UI and WordPress Admin Area

I am creating a plugin that uses a React App to run inside the admin section of WordPress, and this app uses React Material UI (MUI) as well. Everything is great, until I started to use "form&...
Greeso's user avatar
  • 2,086
0 votes
1 answer
126 views

Renaming the 'build' directory generated by @wordpress/scripts for React development

When using @wordpress/scripts to create a React app for WordPress, the default configuration to build the app is via running one of the following two scripts wp-scripts build or wp-scripts start (both ...
Greeso's user avatar
  • 2,086