v1.7.1: fixed-strategy popover positioning + Combobox clear button#10
Merged
Conversation
usePopoverPosition returned document coords (rect + scrollX/scrollY) for position:absolute panels. Inside a position:fixed Modal (with scroll-lock) that coordinate space is wrong and the viewport clamp pinned panels bottom-left (Combobox dropdown displaced in a Modal). Now returns viewport coords and all 12 portaled popovers use position:fixed (Floating UI's robust strategy; the hook already recomputes on capture-phase scroll + resize so panels stay glued). Fixes the whole floating family inside fixed/transformed ancestors. CSS *__popover position:absolute left as-is (always overridden by the inline style; single source of truth).
.combobox__clear was a 22x22 pill (position:absolute, border-radius:pill) with no flex centering, so the X svg sat off-center. Added inline-flex centering + padding:0.
Fixed-strategy popover positioning (works inside Modals) + centered Combobox clear button. Ships in dist; no breaking.
Misael703
added a commit
that referenced
this pull request
May 29, 2026
…list card Two new Storybook stories documenting the recommended pattern for an order detail timeline + the compact list card variant. Story-only — no kit code change, no version bump, no npm release. #9 Despachos · patrón canónico (detalle de orden) — combines the 4 layers the kit offers: milestone anchors top/bottom (Orden creada done, Orden completada pending/done), default operational items with state/tone, right Badge slot for event type (envío/retiro/nota), children payload for items that carry a guía/tracking detail card. The formula scales 1..N dispatches without code changes. #10 Despachos · card de lista (compact) — same pattern at `density="compact"` for the orders list page. Three cards demonstrate the scaling: N=0 (just created), N=3 multi-state in-progress, N=1 ideal happy path delivered.
Misael703
added a commit
that referenced
this pull request
May 29, 2026
In `density="compact"` the milestone marker shrinks from 32px to 16px (compact CSS wins on specificity over the milestone width rule). But the 1.30.1 `margin-left: -4` — sized to centre the 32px milestone against the 24px default in default density — was not overridden in compact. Result: a 16px milestone with margin-left:-4 sat 4px LEFT of the 16px default and the connector. Visible as a dog-leg in story #10. Fix: reset `margin-left: 0` for milestone in compact. With both markers at 16px in compact, no shift is needed. All three markers + the connector now share the same x-axis. New smoke scenario `/scenarios/timeline-milestone-compact` (default → milestone → default per tone at compact density) + assertion that the 3 marker centres land within 1px of the connector centre per tone. Gate: tsc 0 · vitest 510/510 · build 0 · smoke:ci 21 passed (+2).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
v1.7.1 — Floating positioning fix + Combobox clear button
Two real production defects. Ships in
dist; no breaking changes, drop-in.Fixed
usePopoverPositionreturned document coords (rect + scroll) forposition: absolute; inside aposition: fixedModal (with scroll-lock)that space is wrong and the viewport clamp pinned panels bottom-left (the
reported Combobox-in-Modal displacement). Hook now returns viewport coords
and all 12 portaled panels render with
position: fixed. It alreadyrecomputes on capture-phase ancestor scroll + resize, so panels stay glued.
Fixes the whole floating family (Combobox, DatePicker, DateRangePicker,
MultiCombobox, YearPicker, MonthPicker, Popover, HoverCard, Tooltip,
ContextMenu, Menu, Menubar, NavigationMenu) inside fixed/transformed
ancestors and scroll containers.
.combobox__clearlacked flexcentering on its 22×22 pill; added
inline-flexcentering.Notes
*__popover { position: absolute }in CSS left as-is: always overridden bythe inline
position: fixed(single source of truth); editing dead CSS isrisk with zero runtime effect.
Verification
tscclean ·vitest349/349 (0 regressions) ·npm run buildOK ·build-storybookexit 0 ·lintexit 0. 3 atomic commits.