mirror of
https://github.com/backnotprop/plannotator.git
synced 2026-09-14 14:17:26 +08:00
Michael Ramos
ca34a8bbf7
* 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.
34 lines
1.3 KiB
TypeScript
34 lines
1.3 KiB
TypeScript
import { Popover as PopoverPrimitive } from '@base-ui/react/popover';
|
|
import React from 'react';
|
|
|
|
const Popover = PopoverPrimitive.Root;
|
|
const PopoverTrigger = PopoverPrimitive.Trigger;
|
|
|
|
const PopoverContent = React.forwardRef<
|
|
HTMLDivElement,
|
|
PopoverPrimitive.Popup.Props &
|
|
Pick<PopoverPrimitive.Positioner.Props, 'side' | 'sideOffset' | 'align' | 'alignOffset'>
|
|
>(({ className, side, align = 'center', sideOffset = 6, alignOffset, children, ...props }, ref) => (
|
|
<PopoverPrimitive.Portal>
|
|
<PopoverPrimitive.Positioner
|
|
side={side}
|
|
align={align}
|
|
sideOffset={sideOffset}
|
|
alignOffset={alignOffset}
|
|
className="isolate z-[100]"
|
|
>
|
|
<PopoverPrimitive.Popup
|
|
ref={ref}
|
|
className={`bg-popover text-popover-foreground border border-border/50 rounded-lg shadow-xl z-[100] outline-none origin-[var(--transform-origin)] transition-[opacity,scale] duration-150 ease-out data-[starting-style]:opacity-0 data-[starting-style]:scale-95 data-[ending-style]:opacity-0 data-[ending-style]:scale-95 ${className ?? ''}`}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</PopoverPrimitive.Popup>
|
|
</PopoverPrimitive.Positioner>
|
|
</PopoverPrimitive.Portal>
|
|
));
|
|
|
|
PopoverContent.displayName = 'PopoverContent';
|
|
|
|
export { Popover, PopoverTrigger, PopoverContent };
|