tiptap: update bubble menu max-width

This commit is contained in:
fantasticit 2022-04-26 08:40:04 +08:00
parent 4b31a98f90
commit 4fac550c5c
6 changed files with 6 additions and 7 deletions

View File

@ -22,7 +22,7 @@ export const CountdownBubbleMenu = ({ editor }) => {
editor={editor}
pluginKey="countdonw-bubble-menu"
shouldShow={() => editor.isActive(Countdown.name)}
tippyOptions={{ maxWidth: 456 }}
tippyOptions={{ maxWidth: 'calc(100vw - 100px)' }}
>
<Space>
<Tooltip content="编辑">

View File

@ -40,7 +40,7 @@ export const DocumentReferenceBubbleMenu = ({ editor }) => {
editor={editor}
pluginKey="countdonw-bubble-menu"
shouldShow={() => editor.isActive(DocumentReference.name)}
tippyOptions={{ maxWidth: 456 }}
tippyOptions={{ maxWidth: 'calc(100vw - 100px)' }}
>
<Space>
<Popover

View File

@ -65,7 +65,7 @@ export const IframeBubbleMenu = ({ editor }) => {
editor={editor}
pluginKey="link-bubble-menu"
shouldShow={() => editor.isActive(Iframe.name)}
tippyOptions={{ maxWidth: 456 }}
tippyOptions={{ maxWidth: 'calc(100vw - 100px)' }}
>
<Modal
title="编辑链接"

View File

@ -25,7 +25,7 @@ export const ImageBubbleMenu = ({ editor }) => {
pluginKey="image-bubble-menu"
shouldShow={() => editor.isActive(Image.name) && !!editor.getAttributes(Image.name).src}
tippyOptions={{
maxWidth: 456,
maxWidth: 'calc(100vw - 100px)',
}}
matchRenderContainer={(node) => node && node.id === 'js-resizeable-container'}
>

View File

@ -59,7 +59,7 @@ export const LinkBubbleMenu = ({ editor }) => {
editor={editor}
pluginKey="link-bubble-menu"
shouldShow={() => editor.isActive(Link.name)}
tippyOptions={{ maxWidth: 456 }}
tippyOptions={{ maxWidth: 'calc(100vw - 100px)' }}
>
<Space>
<Tooltip content="访问链接">

View File

@ -26,8 +26,7 @@ export const TableBubbleMenu = ({ editor }) => {
pluginKey="table-bubble-menu"
shouldShow={() => editor.isActive(Table.name)}
tippyOptions={{
maxWidth: 486,
placement: 'bottom',
maxWidth: 'calc(100vw - 100px)',
}}
matchRenderContainer={(node: HTMLElement) => node && node.tagName === 'TABLE'}
>