modus-web-components
modus-web-components copied to clipboard
Autocomplete: Add position prop
Description
- Added position prop for the options container
- Used popper library for the options container's position
References Fixes #2801 References #2783
Type of change
- [x] Bug fix (non-breaking change which fixes an issue)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
- [x] Documentation update
How Has This Been Tested?
Checklist
- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [x] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream modules
- [x] I have checked my code and corrected any misspellings
Deploy Preview for moduswebcomponents ready!
| Name | Link |
|---|---|
| Latest commit | 451ff3d8800851bb536f1484586aaecd8e94a29e |
| Latest deploy log | https://app.netlify.com/sites/moduswebcomponents/deploys/67b6f7dad7bd03000826837c |
| Deploy Preview | https://deploy-preview-2846--moduswebcomponents.netlify.app |
| Preview on mobile | Toggle QR Code...Use your smartphone camera to open QR code link. |
Lighthouse |
1 paths audited Performance: 45 (🟢 up 2 from production) Accessibility: 75 (no change from production) Best Practices: 92 (no change from production) SEO: 100 (no change from production) PWA: - View the detailed breakdown and full score reports |
To edit notification comments on pull requests, go to your Netlify site configuration.
@ElishaSamPeterPrabhu Once I select an option from the bottom of the list, I'm not able to change it.
User.Inputs._.Autocomplete.-.Default.Storybook.-.Google.Chrome.2024-09-12.00-17-54.mp4
Added animation change as fix
@ElishaSamPeterPrabhu Once I select an option from the bottom of the list, I'm not able to change it.
User.Inputs._.Autocomplete.-.Default.Storybook.-.Google.Chrome.2024-09-12.00-17-54.mp4
Addressed as part of issue #2282 in PR #2484
Issues Noted:
-
Position property is added twice in 'With Custom Option' canvas (Autocomplete)
-
The Autocomplete Dropdown is jumping up when user scrollng it when it is at the bottom
-
The dropdown width is not matching with the column width (Table: Inline Editing)
-
When the summary row is enabled, it overlaps the dropdown(Table: Inline editing)
-
The dropdown is still hidden (Table: Large Dataset)
Issues Noted:
- Position property is added twice in 'With Custom Option' canvas (Autocomplete)
- The Autocomplete Dropdown is jumping up when user scrollng it when it is at the bottom
- The dropdown width is not matching with the column width (Table: Inline Editing)
- When the summary row is enabled, it overlaps the dropdown(Table: Inline editing)
- The dropdown is still hidden (Table: Large Dataset)
The second point occurs because of the div space offered :
https://github.com/user-attachments/assets/9326998d-7f8f-4a82-861e-399beb79b310
Moving the canvas can give us our expected outcome, hence its not a jump its a way of popper handling the visible options at all times. The fifth point is an existing issue and can be addressed as a seperate issue. All the other points are addressed.
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents
Observed that the dropdown is not adjusted when adding/removing inputs with multiple lines
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents
Observed that the dropdown is not adjusted when adding/removing inputs with multiple lines
![]()
Addressed @Kavin-Trimble
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents
- 0.00% Coverage on New Code (is less than 80.00%)
Analysis Details
3 Issues
0 Bugs
0 Vulnerabilities
3 Code Smells
Coverage and Duplications
0.00% Coverage (0.00% Estimated after merge)
0.00% Duplicated Code (14.10% Estimated after merge)
Project ID: Modus.trimble:ModusWebComponents




