Popover API & Anchor Positioning #41923
Open
+1,869
−1,367
Conversation
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
BREAKING CHANGE: Popper.js is no longer a dependency. Dropdowns, tooltips, and popovers now use native CSS Anchor Positioning with a polyfill fallback. JavaScript: - Add positioning.js utility with responsive placement support - Rewrite dropdown.js to use anchor positioning and popover attribute - Rewrite tooltip.js to use anchor positioning - Update popover.js with data-api click handler - Remove Popper.js imports and configuration options - Add responsive placement syntax (e.g., "bottom md:top lg:right-start") SCSS: - Add _anchor-positioning.scss with base styles for positioned elements - Update dropdown, tooltip, and popover styles for anchor positioning - Add b-dropdown custom element support Package: - Replace @popperjs/core with @oddbird/css-anchor-positioning (optional polyfill) Docs: - Update dropdowns, tooltips, and popovers documentation
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
This is basically saving a checkpoint for ourselves in case we want to revisit. I don't think it'll work out unfortunately for v6 because the native feature support and the polyfill just isn't flexible for our needs. The biggest concern around adopting Popover API for our dropdowns, popovers, and tooltips is that they ALL go into the special top-layer of browsers. This isn't logical or useful for us because we need to control the placement, layering, etc of these relevant components.
Not to be merged.