fix(ui): replace form with div in link popover to prevent unintended submit behavior
- swap `<form>` wrapper for `<div>` to avoid native form submission - add `onKeyDown` handler on input to trigger submit on Enter key - change button type from `submit` to `button` with explicit `onClick` handler
This commit is contained in:
@@ -175,8 +175,7 @@ export default function InlineToolbar({ rect, activeMarks, onToggleMark, onClear
|
|||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{popover === 'link' && (
|
{popover === 'link' && (
|
||||||
<form
|
<div
|
||||||
onSubmit={handleLinkSubmit}
|
|
||||||
className="absolute top-full left-0 mt-1 flex flex-col gap-1.5 rounded-lg border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-900 shadow-md px-2 py-1.5"
|
className="absolute top-full left-0 mt-1 flex flex-col gap-1.5 rounded-lg border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-900 shadow-md px-2 py-1.5"
|
||||||
>
|
>
|
||||||
<div className="flex items-center gap-1">
|
<div className="flex items-center gap-1">
|
||||||
@@ -186,10 +185,12 @@ export default function InlineToolbar({ rect, activeMarks, onToggleMark, onClear
|
|||||||
placeholder="https://..."
|
placeholder="https://..."
|
||||||
value={linkUrl}
|
value={linkUrl}
|
||||||
onChange={(e) => setLinkUrl(e.target.value)}
|
onChange={(e) => setLinkUrl(e.target.value)}
|
||||||
|
onKeyDown={(e) => { if (e.key === 'Enter') { e.preventDefault(); handleLinkSubmit(e); } }}
|
||||||
className="w-56 px-2 py-1 text-sm rounded border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-900 text-neutral-900 dark:text-white outline-none focus:border-blue-500"
|
className="w-56 px-2 py-1 text-sm rounded border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-900 text-neutral-900 dark:text-white outline-none focus:border-blue-500"
|
||||||
/>
|
/>
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="button"
|
||||||
|
onClick={handleLinkSubmit}
|
||||||
className="px-2 py-1 text-xs rounded bg-blue-600 hover:bg-blue-700 text-white"
|
className="px-2 py-1 text-xs rounded bg-blue-600 hover:bg-blue-700 text-white"
|
||||||
>
|
>
|
||||||
OK
|
OK
|
||||||
@@ -214,7 +215,7 @@ export default function InlineToolbar({ rect, activeMarks, onToggleMark, onClear
|
|||||||
/>
|
/>
|
||||||
Ouvrir dans un nouvel onglet
|
Ouvrir dans un nouvel onglet
|
||||||
</label>
|
</label>
|
||||||
</form>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user