props.isHovered not working

[phpbits]

Hi,

I'm creating a tabbed-layout column for easier column management and found out that isSelected is working but isHovered isn't. Here's a preview on what I'm working on. Thanks!

Cheers,
Jeffrey

[youknowriad]

In which component isHovered is not working? Is it in a block? If that's the case, I think isHovered was never a thing there?

[phpbits]

@youknowriad Hmmm, searched and there's isHovered on property. What do you recommend in order for me to display the tabs on inner block selection? I need to be able to display them aside from when the main column block is selected. Thanks!

[youknowriad]

Maybe you should try showing them inside the edit function of your wrapper's block. But not as buttons in the BlockControls but directly inside the block itself.

[phpbits]

@youknowriad I'm using blocks.BlockEdit filter via ES5, would you mind letting me know which is the edit function? I'm using similar function to this one : #4002 Thanks!

[youknowriad]

Oh, so you're extending the core provided columns block, I suggested creating your own columns block instead. Or if you prefer, you can add the tabs to your blocks.BlockEdit hook for the columns block.

[phpbits]

@youknowriad yes. I think there's no point on creating a new one since I'll be adding toggle selection view on the block's setting area. Do you think it's possible to show the tabs when innerblocks are selected? Thanks!

[youknowriad]

If the tabs are not displayed in BlockControls they will be always visible.

[phpbits]

@youknowriad Thanks! Will try it out.

[youknowriad]

I'm closing for now, let me know if it doesn't work.

[phpbits]

@youknowriad I thinks there's no option aside from BlockControls. Do you have any suggestion? Thanks!

[youknowriad]

Just remove the BlockControls wrapper. Can you share the code of your hook?

[phpbits]

@youknowriad I'm using similar code to this one : #4002 👍

var testButton = !! props.focus
                && el(
                    BlockControls,
                    { key: 'test_button_block' },
                    el(
                        TestButton,
                        {
                            button: {
                                key: 'test_button',
                                isPrimary: false,
                                title: __( 'Test', 'test' ),
                                onClick: onTestButtonClick
                            },
                            container: {
                                className: 'components-toolbar'
                            },
                        }
                    )
                );
            element = [ element, testButton ];

[phpbits]

@youknowriad Can you change the status to open again? Thanks!

[youknowriad]

Remove the wrapper BlockControls and the props.focus test

[phpbits]

@youknowriad Thanks! It's working now. Another question is do have idea how can I add item on the Block Settings? I need to add toggle view for tabbed and the default one. Thanks!

[phpbits]

@youknowriad There's a problem on onClick when it's not on BlockControls. Seems like click is disabled. Thanks!

[youknowriad]

how can I add item on the Block Settings?

That's not possible and that maybe a good Extensibility Slot to add, but not possible at the moment.

There's a problem on onClick when it's not on BlockControls. Seems like click is disabled. Thanks!

Unfortunately, I can't debug all the issues you have in your plugin, a bit more efforts to find the source of these issues would be greatly appreciated.