Add @offset and @shift to Popover (CSS anchor positioning)

[Copilot]

Restores @offset and @shift arguments dropped when floating-ui was replaced with CSS anchor positioning.

@offset?: number

Gap in pixels between the anchor and the floating element. Applied as CSS margin on the inward-facing side (margin-top for bottom placement, etc.).

@shift?: boolean | number | { padding?: number }

Slides the floating element along its placement axis to keep it within the viewport. CSS Anchor Positioning has no native shift equivalent — this is implemented via a single requestAnimationFrame that reads the bounding rect post-layout and applies a margin correction.

• true — shift with 0px viewport padding
• number — shift with that many pixels from the viewport edge
• { padding: number } — same as the number form

<Popover @placement="bottom" @offset={{8}} @shift={{4}} as |p|> <button {{p.reference}}>Trigger</button> <p.Content>…</p.Content> </Popover>

Cleanup cancels any pending rAF and removes all applied margin properties.

---

📱 Kick off Copilot coding agent tasks wherever you are with GitHub Mobile, available on iOS and Android.

[bolt-new-by-stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[NullVoxPopuli]

@copilot there are lint failures

[Copilot]

@copilot there are lint failures

Fixed in 976226b — prettier was collapsing the <Popover> attributes in menu.gts to a single line. Ran prettier --write on the file to bring it in line. The docs-app#lint:js errors are pre-existing in files unrelated to our changes.

[NullVoxPopuli]

@copilot is there no way to manage shift / offset options with the native thing?

[Copilot]

Offset: yes — setting margin on the positioned element creates a gap between anchor and content, so we could expose an @offset arg that sets margin in the applyAnchorPositioning modifier.

Shift: no direct equivalent. CSS anchor positioning's position-try-fallbacks (what we already set) provides flip behavior (tries the opposite side when overflowing), but there's no native CSS mechanism for "slide along the current side to stay in the viewport" — that requires JS. Custom @position-try at-rules could define explicit inset overrides but they'd be static, not viewport-aware.

Happy to add @offset support if that's desirable.

[Copilot]

Just as a heads up, I was blocked by some firewall rules while working on your feedback. Expand below for details.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• developer.mozilla.org
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node /home/REDACTED/work/_temp/ghcca-node/node/bin/node --enable-source-maps /home/REDACTED/work/_temp/copilot-developer-action-main/dist/index.js (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

[github-actions]

Project	Preview URL
Docs	https://3b4339e3.ember-primitives.pages.dev

Logs