fix: list item checkbox/delete broken by pointer capture, badge wrapping
setPointerCapture on the swipe row div was swallowing click events from child buttons; guard now bails early when the pointer originates from a button or input. Also added whitespace-nowrap + shrink-0 to the list type/count badge to prevent it wrapping across two lines.
This commit is contained in:
@@ -108,7 +108,7 @@ export function ListDetail({ initialList }: { initialList: ListDetailDto }) {
|
|||||||
onChange={(event) => setList({ ...list, name: event.target.value })}
|
onChange={(event) => setList({ ...list, name: event.target.value })}
|
||||||
onBlur={commitListName}
|
onBlur={commitListName}
|
||||||
/>
|
/>
|
||||||
<span className="badge">
|
<span className="badge whitespace-nowrap shrink-0">
|
||||||
{list.type} · {list.openCount} open
|
{list.type} · {list.openCount} open
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -202,6 +202,7 @@ function ListItemRow({
|
|||||||
const MAX_SWIPE = 100; // px maximum visual displacement
|
const MAX_SWIPE = 100; // px maximum visual displacement
|
||||||
|
|
||||||
function handlePointerDown(e: React.PointerEvent<HTMLDivElement>) {
|
function handlePointerDown(e: React.PointerEvent<HTMLDivElement>) {
|
||||||
|
if ((e.target as HTMLElement).closest("button, input")) return;
|
||||||
e.currentTarget.setPointerCapture(e.pointerId);
|
e.currentTarget.setPointerCapture(e.pointerId);
|
||||||
swipeOrigin.current = { x: e.clientX, y: e.clientY };
|
swipeOrigin.current = { x: e.clientX, y: e.clientY };
|
||||||
isScrolling.current = false;
|
isScrolling.current = false;
|
||||||
|
|||||||
Reference in New Issue
Block a user