Currently tooltip for setting links is attached to the parent container, which sometimes cutting off the edges. There is a bounds options which will handle it to some extent. But fails when editor width is less. The only way we can reliably place tooltip is by attaching it to body. May be as a configurable option for the cases like above.
Steps for Reproduction
Expected behavior:
Tooltip should not cutoff the edges regardless of width and placement of the editor
Actual behavior:
Tooltip gets cutoff
Platforms:
Tested in macOS chrome. But seem to be the case in all browsers
Version:
1.3.6
There are couple of issues were raised and closed on the same topic. But I think it's a valid requirement. So raising it again.
https://github.com/quilljs/quill/issues/1103
https://github.com/quilljs/quill/issues/1100
https://github.com/quilljs/quill/issues/1994
https://github.com/quilljs/quill/issues/360
Attaching potentially overflowing content (like tooltips, modals, etc...) is pretty standard.
Common practice is to attach to the body as last child, which should be a standard option in the quill config.
Definitely +1 for this one.
I found a solution for my situation:
when create the configuration object, set property _'bounds'_ with the selector of quill container.
Example:
const DEFAULT_CONFIG = {
theme: 'bubble',
bounds: '#quill-container-2'
};
new Quill('#quill-container-2', DEFAULT_CONFIG);
@FenoRC as stated above here and in other related issue (https://github.com/quilljs/quill/issues/1100) _bounds_ would not work if there is other content near your editor or the editor of insufficient width/height. Editor and neighboring containers may be on a well different levels in a page html tree, making it nearly impossible to put the tooltip bubble on top of other neighboring content (z-index neither will work because of that)
Right now, the only possible solution requires rewriting HTML tree so that quill container is on top of every neighbor.
The obvious and standard solution for that is to attach to body
Most helpful comment
Attaching potentially overflowing content (like tooltips, modals, etc...) is pretty standard.
Common practice is to attach to the body as last child, which should be a standard option in the quill config.
Definitely +1 for this one.