githubnext/chopinPublic

Let's compose rich plans together

Put the selection toolbar where the selection is

The bubble was placed twice. Tailwind v4 compiles `-translate-x-1/2` and
`-translate-y-full` to the standalone `translate` property, while the layout
effect set `transform` — separate properties that compose, so the bubble moved
a full width left and two full heights up rather than half and one. Placement
now belongs to the layout effect alone, and the utilities are gone from the
compiled CSS entirely.

The edge correction was also measuring its own output. It read
`getBoundingClientRect()`, which reports the rect after transforms, so it
computed a shift from an element already carrying that shift; when the block
menu changed the bubble's width the effect re-ran, saw no overflow from the
already-corrected position and dropped the correction. It now works from
`position.left` and `offsetWidth`, which transforms do not move.

The left edge is guarded as well as the right. Ace only needed the right when
the editor filled the window; the plan is a middle column here and can be
dragged narrow enough to push the bubble under the chat.

No test: happy-dom performs no layout, so `getBoundingClientRect` and
`offsetWidth` both return zero and anything asserted here would be fiction.
Verified by looking.

Both faults were ported — Ace's bubble.tsx carries the same two.
KCKrzysztof Cieslak authored
affc368Patch
Parenta3c7663
1 file changed+30-8
StackedSplit
packages/editor/src/toolbar/bubble.tsx+30 −8