Files
backnotprop__plannotator/packages/ui/.migration/tooltip.md
Michael Ramos ca34a8bbf7 Migrate @plannotator/ui to Base UI (0.23.0) (#1013)
* chore: restore packages/core workspace entry missing from bun.lock

#957 merged without its bun.lock update; fresh installs couldn't
resolve @plannotator/core workspace links.

* chore(ui): install @base-ui/react alongside radix; migration assessment

* feat(ui): migrate badge to Base UI (Slot -> useRender, asChild -> render)

* feat(ui): migrate button to Base UI Button primitive (asChild -> render)

* feat(ui): migrate tabs to Base UI (Trigger->Tab, Content->Panel, data-active)

* feat(ui): migrate dialog to Base UI (Overlay->Backdrop, Content->Popup)

* feat(ui): migrate dropdown-menu to Base UI Menu + sweep both consumers

* feat(ui): migrate Popover wrapper to Base UI (Positioner model; drop PopoverAnchor)

* feat(ui): migrate Tooltip wrapper to Base UI, public API preserved

* feat(ui): migrate PopoutDialog to Base UI (non-modal + reason-based dismissal guard)

* feat(ui): remove all @radix-ui dependencies — package is fully Base UI

* chore(ui): 0.23.0 release notes — Base UI engine, drop tailwindcss-animate peer

HANDOFF.md documents the engine swap for the Workspaces consumer:
dependency changes, 11 breaking/behavior items, what did not change.
Version bumped to 0.23.0; publish stays owner-gated.

* docs(ui): record browser smoke results in migration report

* fix(ui): self-review findings — caret Base UI range, Button type default documented, PopoutDialog focus-out guard hardened

- @base-ui/react 1.6.0 -> ^1.6.0: a consumer's own Base UI install must
  dedupe with ours or portals lose context across copies
- HANDOFF item 12 + button report: Button now defaults type="button"
  (implicit form submit is a consumer-only breaking change)
- PopoutDialog: guard both event.target and relatedTarget on focus-out —
  blur-shaped events carry the annotation toolbar in relatedTarget

* docs(ui): record human hand-verification pass in migration report

* feat(ui): 150ms exit fade on popovers + prefers-reduced-motion for all Base UI popups

Popover enter/exit unified on starting/ending-style transitions (the
popover-enter keyframe only existed in review-editor CSS — plan-app
popovers had no enter animation at all). Reduced-motion rule in theme.css
covers dialogs, menus, popovers, tooltips in both apps.
2026-07-07 12:32:51 -07:00

2.7 KiB
Raw Permalink Blame History

tooltip (hand-rolled wrapper)

2026-07-07, transformation engine. Verdict: migrated with ZERO call-site churn — the wrapper's public prop names are kept and mapped internally (house seam style for this published package).

Changed

  • packages/ui/components/Tooltip.tsx — @radix-ui/react-tooltip → @base-ui/react/tooltip.
    • TooltipProvider was a bare re-export of Radix Provider; it is now a thin wrapper KEEPING the Radix-era prop names: delayDuration → Base delay, skipDelayDuration → Base timeout (same skip-window semantics), disableHoverableContent → carried via context and applied per-root as disableHoverablePopup (Base UI dropped the provider-level knob). Both app call sites (packages/editor/App.tsx:3808, packages/review-editor/App.tsx:2651) compile and behave unchanged.
    • Tooltip keeps its API (content/side/align/delayDuration/ sideOffset/wide); internally Trigger asChild → render={children}, per-tooltip delayDuration moves to Trigger delay, Content → Portal > Positioner > Popup with side/align/sideOffset forwarded to the Positioner (FORWARD rule).
    • Classes: data-[state=closed/delayed-open/instant-open] opacity/scale dance → data-[starting-style]/data-[ending-style] transitions; --radix-tooltip-content-transform-origin → --transform-origin.
    • children type narrowed ReactNode → ReactElement (render prop needs an element; Radix asChild silently required one anyway). All 5 call sites (editor ×3, review-editor ×2) already pass single elements — verified, review-editor is not covered by tsc. Leftover scan clean: grep -n "radix-ui\|@radix-ui\|asChild" — no matches.

Left alone

  • All Tooltip call sites — byte-identical (the point of keeping the API).

Behavior changes

  • Default open delay when neither Provider nor call site sets one: Radix 700ms → Base UI 600ms. Both apps set Provider delays (900 / 200), so only provider-less consumers of the published package see it. HANDOFF item.
  • Skip-window default (skipDelayDuration unset): 300ms → 400ms. Same provider-set caveat.
  • Tooltip content is hoverable by default in BOTH engines; the editor app's disableHoverableContent behavior is preserved via the context seam.

Verify by hand

  • Plan app toolbar (wide-mode buttons): tooltip appears after ~900ms, moving pointer between adjacent buttons opens the next tooltip near-instantly (skip window), tooltip does NOT stay open when the pointer moves onto it.
  • Review app file row "Mark as viewed": tooltip below the icon after ~300ms.
  • DiffTypePicker hint (wide): wraps at 260px, positioned right.