search

kommitters / editorjs-tooltip

Tooltips for editorjs
https://www.npmjs.com/package/editorjs-tooltip
MIT License
37 stars 15 forks source link

Change tooltip style by using Joy UI Tooltip component #99

Closed BensenHsu closed 1 year ago

BensenHsu commented 1 year ago

Is your feature request related to a problem? Please describe.

  1. When the content is too long, the tooltip cannot wrap, so it will be blocked beyond the edge of the browser

    image

  2. The default tooltip style is hard coded, so cannot display other information such as images.

Describe the solution you'd like

Joy UI Tooltip component: https://mui.com/joy-ui/react-tooltip/#common-examples I want to use Joy UI to replace the CodeX tooltip in the code to solve the above problems. However, the tooltip does not work as I change the code to the screenshot below:

image

Describe alternatives you've considered

Can also use Tippy.js: https://tippyjs.bootcss.com/getting-started/

Additional context

@miguelnietoa @luishurtado @juanhurtado10 Could you please take a look? Much appreciated!!!

BensenHsu commented 1 year ago

Hi @miguelnietoa !

miguelnietoa commented 1 year ago

Hi @BensenHsu, thanks for submitting this feature request!

What you propose is that the plugin can accept HTML code to be rendered as the tooltip. In this way, being more customizable and allowing to display of other information such as images, right?

BensenHsu commented 1 year ago

Hi @BensenHsu, thanks for submitting this feature request!

What you propose is that the plugin can accept HTML code to be rendered as the tooltip. In this way, being more customizable and allowing to display of other information such as images, right?

@miguelnietoa Yea! Exactly!

BensenHsu commented 1 year ago

@miguelnietoa I tried to change the file to .tsx, it accepted HTML, but the tooltip did not show up.

miguelnietoa commented 1 year ago

Hey @BensenHsu, could you please provide a code sandbox (https://codesandbox.io/) to understand in depth the feature request?