Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(floating-ui): add feature flag for dynamic floating-ui styles #17727

Merged

Conversation

annawen1
Copy link
Member

Closes #17018

This PR introduces a new feature flag (enable-v12-dynamic-floating-styles) to separate the @floating-ui logic. By turning on the flag, components will have dynamically positioned floating styles without the collision detection currently in place.

To have the collision detect logic, adopter will set the autoAlign prop to true which will automatically include the dynamic styling - so the feature flag is not necessary in this case.

Changelog

New

  • enable-v12-dynamic-floating-styles feature flag

Changed

  • add checks in current components utilitizing @floating-ui to separate out the style and middleware logic

Testing / Reviewing

  • go to deploy preview, Feature flags section
  • go to Dynamic floating styles folder and inspect the components and see that the styles are set dynamically

Copy link

netlify bot commented Oct 11, 2024

Deploy Preview for carbon-elements ready!

Name Link
🔨 Latest commit 05e81f3
🔍 Latest deploy log https://app.netlify.com/sites/carbon-elements/deploys/670977cec0254500089d86df
😎 Deploy Preview https://deploy-preview-17727--carbon-elements.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Oct 11, 2024

Deploy Preview for v11-carbon-react ready!

Name Link
🔨 Latest commit 05e81f3
🔍 Latest deploy log https://app.netlify.com/sites/v11-carbon-react/deploys/670977ce0aaa8900083ef0be
😎 Deploy Preview https://deploy-preview-17727--v11-carbon-react.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link
Member

@emyarod emyarod left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good to me!

Copy link

codecov bot commented Oct 11, 2024

Codecov Report

Attention: Patch coverage is 75.92593% with 13 lines in your changes missing coverage. Please review.

Project coverage is 78.99%. Comparing base (a71040f) to head (05e81f3).
Report is 3 commits behind head on main.

Files with missing lines Patch % Lines
...s/react/src/components/OverflowMenu/next/index.tsx 33.33% 5 Missing and 1 partial ⚠️
...s/react/src/components/MultiSelect/MultiSelect.tsx 57.14% 2 Missing and 1 partial ⚠️
...ackages/react/src/components/ComboBox/ComboBox.tsx 66.66% 1 Missing and 1 partial ⚠️
...ackages/react/src/components/Dropdown/Dropdown.tsx 75.00% 2 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main   #17727      +/-   ##
==========================================
- Coverage   79.00%   78.99%   -0.01%     
==========================================
  Files         408      408              
  Lines       14009    14032      +23     
  Branches     4320     4338      +18     
==========================================
+ Hits        11068    11085      +17     
- Misses       2775     2782       +7     
+ Partials      166      165       -1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

Merged via the queue into carbon-design-system:main with commit 4b4fe02 Oct 11, 2024
23 checks passed
@annawen1 annawen1 deleted the feat/feature-flag-floating-ui-styles branch October 11, 2024 19:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Floating UI: Allow floating-ui-based positioning without autoAlign collision detection
3 participants