Yoopta-Editor icon indicating copy to clipboard operation
Yoopta-Editor copied to clipboard

Cannot toggle text into link with custom toolbar

Open legowtham opened this issue 2 years ago • 0 comments

Describe the bug:

I'm trying to toggle link with custom toolbar after selecting the text. The url input box doesn't open.

CustomToolBar.js

...
<ToolbarButton isActive={elements['link']?.isActive} type="button" onClick={() => elements['link'].toggle()}>
           <Link isActive={elements['link']?.isActive} />
</ToolbarButton>
...

TextEditor.js

<YooptaEditor
plugins={plugins}
value={value}
marks={marks}
onChange={handleOnChange}
placeholder="Type / for commands or just type your content."
tools={{
Toolbar: <Toolbar type="bubble" render={CustomToolBar} />,
ActionMenu: <ActionMenu render={CustomActionMenu} items={actionItems} />,
LinkTool: <LinkTool asChildren={false} />,
}}
/>

To Reproduce Steps to reproduce the behavior:

Try to toggle link with onClick={() => elements['link'].toggle()}> in the custom toolbar.

Expected behavior On toggle, the link input box should open so I can paste my url.

Additional log: const elements = useElements(); console.log(elements) outputs below:

Screenshot 2023-06-29 011640

If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

OS: Windows 11 22621.1702 Browser: Chrome 113.0.5672.93 Version : "@yoopta/action-menu-list": "^1.9.10-rc", "@yoopta/callout": "^1.9.10-rc", "@yoopta/code": "^1.9.10-rc", "@yoopta/editor": "1.9.14-rc", "@yoopta/embed": "^1.9.10-rc", "@yoopta/headings": "^1.9.10-rc", "@yoopta/image": "^1.9.10-rc", "@yoopta/link": "^1.9.10-rc", "@yoopta/link-tool": "^1.9.3-rc", "@yoopta/lists": "^1.9.10-rc", "@yoopta/marks": "^1.9.10-rc", "@yoopta/paragraph": "^1.9.12-rc", "@yoopta/renderer": "^1.9.10-rc", "@yoopta/toolbar": "^1.9.10-rc", "@yoopta/video": "^1.9.10-rc",

legowtham avatar Jun 28 '23 19:06 legowtham