Skip to content

Conversation

@bmartel
Copy link
Contributor

@bmartel bmartel commented Nov 24, 2025

This pull request introduces several improvements to the dropdown component and its styling, focusing on enhanced alignment and positioning logic, better SCSS class management, and minor API updates. The main themes are improved dropdown positioning using CSS anchor positioning with intelligent fallbacks, SCSS class prefixing for consistency, and small API/documentation tweaks.

Dropdown positioning and alignment improvements:

  • The dropdown component now uses CSS anchor positioning with a comprehensive fallback strategy, automatically adjusting its position based on available space and alignment preferences. This reduces the need for manual upward-opening logic and ensures better placement in various viewport scenarios.
  • The deprecated openUpwardForShortViewport prop is now documented as obsolete, since positioning is handled automatically by CSS anchor positioning and fallbacks.
  • The dropdown's computed styles now place props.style last, so user-supplied styles can override alignment-based positioning if needed.

SCSS and class naming improvements:

  • The Storybook webpack config now automatically prefixes non-module SCSS class names with ls- (except for Ant Design classes), improving BEM-style consistency and avoiding class name collisions.
  • The dropdown SCSS now uses flex-direction: column to better support scrollable inner content, replacing the previous overflow: auto approach.

API and typing updates:

  • The DropdownTriggerProps interface now explicitly includes a children prop for clarity and better typing.
  • The Dropdown export is now correctly typed with a static Trigger property for improved TypeScript compatibility and backward compatibility.

@github-actions github-actions bot added the chore label Nov 24, 2025
@netlify
Copy link

netlify bot commented Nov 24, 2025

Deploy Preview for label-studio-storybook ready!

Name Link
🔨 Latest commit c0d5642
🔍 Latest deploy log https://app.netlify.com/projects/label-studio-storybook/deploys/6925f43b9ad97d0008ee295c
😎 Deploy Preview https://deploy-preview-8880--label-studio-storybook.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 project configuration.

@netlify
Copy link

netlify bot commented Nov 24, 2025

Deploy Preview for heartex-docs canceled.

Name Link
🔨 Latest commit c0d5642
🔍 Latest deploy log https://app.netlify.com/projects/heartex-docs/deploys/6925f43b3ddb920008c93f3e

@netlify
Copy link

netlify bot commented Nov 24, 2025

Deploy Preview for label-studio-docs-new-theme canceled.

Name Link
🔨 Latest commit c0d5642
🔍 Latest deploy log https://app.netlify.com/projects/label-studio-docs-new-theme/deploys/6925f43b1f0bca000884b407

@netlify
Copy link

netlify bot commented Nov 24, 2025

Deploy Preview for label-studio-playground ready!

Name Link
🔨 Latest commit c0d5642
🔍 Latest deploy log https://app.netlify.com/projects/label-studio-playground/deploys/6925f43b7ce70e0007a0cd09
😎 Deploy Preview https://deploy-preview-8880--label-studio-playground.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 project configuration.

@codecov
Copy link

codecov bot commented Nov 24, 2025

Codecov Report

❌ Patch coverage is 75.00000% with 10 lines in your changes missing coverage. Please review.
✅ Project coverage is 57.79%. Comparing base (f4a47e3) to head (c0d5642).
⚠️ Report is 2 commits behind head on develop.

Files with missing lines Patch % Lines
web/libs/ui/src/lib/dropdown/dropdown.tsx 75.00% 10 Missing ⚠️

❗ There is a different number of reports uploaded between BASE (f4a47e3) and HEAD (c0d5642). Click for more details.

HEAD has 1 upload less than BASE
Flag BASE (f4a47e3) HEAD (c0d5642)
pytests 1 0
Additional details and impacted files
@@             Coverage Diff             @@
##           develop    #8880      +/-   ##
===========================================
- Coverage    65.85%   57.79%   -8.07%     
===========================================
  Files          820      561     -259     
  Lines        64433    40864   -23569     
  Branches     11023    11033      +10     
===========================================
- Hits         42433    23616   -18817     
+ Misses       21996    17244    -4752     
  Partials         4        4              
Flag Coverage Δ
lsf-e2e 51.82% <75.00%> (+1.38%) ⬆️
lsf-integration 48.58% <75.00%> (+0.38%) ⬆️
lsf-unit 8.33% <ø> (ø)
pytests ?

Flags with carried forward coverage won't be shown. Click here to find out more.

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

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@bmartel
Copy link
Contributor Author

bmartel commented Nov 25, 2025

/fm sync

Workflow run

@bmartel
Copy link
Contributor Author

bmartel commented Nov 25, 2025

/fm sync

Workflow run

@bmartel bmartel merged commit 02b8c8c into develop Nov 25, 2025
63 of 66 checks passed
@robot-ci-heartex robot-ci-heartex deleted the fb-fit-1002-properties branch November 25, 2025 21:20
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.

4 participants