fix: force popover to left placement with soft wrap when space is limited

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
thibaud-leclere
2026-03-30 22:53:58 +02:00
parent 273ea49ed0
commit 0706d99c82
2 changed files with 14 additions and 2 deletions

View File

@@ -1,5 +1,5 @@
import React, { useState } from 'react';
import { useFloating, useClick, useDismiss, useInteractions, offset, flip, shift } from '@floating-ui/react';
import { useFloating, useClick, useDismiss, useInteractions, offset, shift, size } from '@floating-ui/react';
const HINT_ICONS = {
film: 'fa-solid fa-film',
@@ -13,7 +13,17 @@ export default function ActorPopover({ hintType, hintText }) {
const { refs, floatingStyles, context } = useFloating({
open: isOpen,
onOpenChange: setIsOpen,
middleware: [offset(8), flip(), shift()],
middleware: [
offset(8),
size({
apply({ availableWidth, elements }) {
Object.assign(elements.floating.style, {
maxWidth: `${availableWidth}px`,
});
},
}),
shift({ padding: 8 }),
],
placement: 'left',
});