diff --git a/packages/ui/src/RichEditor/OptionsMenu/OptionsMenuTrigger.tsx b/packages/ui/src/RichEditor/OptionsMenu/OptionsMenuTrigger.tsx index 09c3db4e8..e8508f9e7 100644 --- a/packages/ui/src/RichEditor/OptionsMenu/OptionsMenuTrigger.tsx +++ b/packages/ui/src/RichEditor/OptionsMenu/OptionsMenuTrigger.tsx @@ -61,8 +61,13 @@ export function OptionsMenuTrigger({ const wrapper = document.createElement("div"); wrapper.append(hoveredBlock.cloneNode(true)); wrapper.style.position = "absolute"; - wrapper.style.top = "-10000px"; + wrapper.style.left = "-10000px"; + wrapper.style.top = "0"; + wrapper.style.minWidth = "1px"; + wrapper.style.minHeight = "1px"; document.body.append(wrapper); + // Safari needs the element laid out before setDragImage + void wrapper.offsetHeight; e.dataTransfer.setDragImage(wrapper, 0, 0); document.addEventListener("dragend", () => wrapper.remove(), { once: true }); } diff --git a/packages/ui/src/RichEditor/OptionsMenu/variants.ts b/packages/ui/src/RichEditor/OptionsMenu/variants.ts index 6b999ee3b..743d0c479 100644 --- a/packages/ui/src/RichEditor/OptionsMenu/variants.ts +++ b/packages/ui/src/RichEditor/OptionsMenu/variants.ts @@ -8,7 +8,7 @@ export const optionsMenuVariants = tv({ slots: { trigger: [ "z-20 flex size-5 items-center justify-center", - "rounded text-txt-tertiary hover:bg-subtle hover:text-txt-primary cursor-grab", + "rounded text-txt-tertiary hover:bg-subtle hover:text-txt-primary cursor-grab active:cursor-grabbing", ], menu: ["rounded-lg border border-border-mid bg-level-0 p-1 shadow-mid z-30"], },