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

fix(autocomplete): Autocomplete drop container should take content width #897

Merged
merged 1 commit into from
Feb 9, 2023

Conversation

ghiscoding
Copy link
Owner

current behavior with width being assigned input width

image

expected behavior with this PR changes

image

- by default the Kraaden Autocomplete lib sets the drop container width to be the same as the input width but that isn't a good UX in a datagrid so we need to unset the width and let pure CSS use auto width
- ref denis-taran/autocomplete#102
@codecov
Copy link

codecov bot commented Feb 9, 2023

Codecov Report

Merging #897 (da3bbe2) into master (99677f0) will not change coverage.
The diff coverage is 100.00%.

@@            Coverage Diff            @@
##            master      #897   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          244       244           
  Lines        16563     16567    +4     
  Branches      5895      5895           
=========================================
+ Hits         16563     16567    +4     
Impacted Files Coverage Δ
packages/common/src/editors/autocompleterEditor.ts 100.00% <100.00%> (ø)
packages/common/src/filters/autocompleterFilter.ts 100.00% <100.00%> (ø)

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

@ghiscoding ghiscoding merged commit 9690a38 into master Feb 9, 2023
@ghiscoding ghiscoding deleted the bugfix/autocomplete-container-width branch February 9, 2023 18:40
ghiscoding pushed a commit that referenced this pull request Dec 1, 2023
- a previous PR #897 caused a regression on a cell with a select dropdown (like `Slick.Editors.YesNoSelect`), the regression was caused by the implementation of Draggable `allowDragFromClosest` which will check if current DOM element is `.slick-cell` or if not it will also try its ancestor and that caused the regression because the cell with the editor also had a `.slick-cell` and so the code taught that the user started a drag and it cancelled event bubbling which in turn also prevented the select dropdown to be clickable.
- to fix this issue we need to make sure that the cell is queried not just with `div.slick-cell` but also with certain CSS classes, we need to check if parent has either `.dnd` or `.cell-reorder` to permit the dragging when checking parent cell with `allowDragFromClosest`
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant