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

1565 - Add typeahead dropdown icon/button #1735

Merged
merged 7 commits into from
Apr 19, 2021

Conversation

KaneFreeman
Copy link
Member

Type: feature

The following has been addressed in the PR:

  • There is a related issue
  • All code matches the style guide
  • Unit tests are included in the PR
  • For new widgets, an entry has been added to the .dojorc
  • For new widgets, theme.variant() is added to the root domnode
  • Any widget variant uses theme.compose like this
  • WidgetProperties are exported

Description:
Add typeahead dropdown icon/button

Resolves #1565

@vercel
Copy link

vercel bot commented Apr 9, 2021

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployments, click below or on the icon next to each commit.

dojo.widgets – ./

🔍 Inspect: https://vercel.com/dojo/dojo.widgets/6NGGzjUkWS36h8swiA7Uh2bDYgGN
✅ Preview: https://dojowidgets-git-fork-kanefreeman-feature-typeahead-se-1004d2.vercel.app

widget-test-docs – ./

🔍 Inspect: https://vercel.com/dojo/widget-test-docs/BznWtFVvGuBVNeBGXqF3bTjRaTgM
✅ Preview: https://widget-test-do-git-fork-kanefreeman-feature-typeahead-se-337887.vercel.app

@codecov
Copy link

codecov bot commented Apr 9, 2021

Codecov Report

Merging #1735 (21d73ac) into master (23b69c3) will increase coverage by 0.06%.
The diff coverage is 93.75%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #1735      +/-   ##
==========================================
+ Coverage   90.36%   90.43%   +0.06%     
==========================================
  Files          94       94              
  Lines        5129     5143      +14     
  Branches     1398     1403       +5     
==========================================
+ Hits         4635     4651      +16     
+ Misses        243      241       -2     
  Partials      251      251              
Impacted Files Coverage Δ
src/typeahead/index.tsx 82.89% <93.75%> (+2.05%) ⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 23b69c3...21d73ac. Read the comment docs.

label,
leading,
trailing: showDropDownButton && (
<button
Copy link
Member

Choose a reason for hiding this comment

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

We couldn't use the dojo button here?

Copy link
Member Author

Choose a reason for hiding this comment

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

This is following the same pattern that the Select widget is using. If we want to change that pattern both should be changed together.

@@ -53,6 +55,8 @@ export interface TypeaheadProperties {
itemDisabled?: ListProperties['disabled'];
/** Flag to indicate if values other than those in the resource can be entered, defaults to true */
strict?: boolean;
/** Flag to indicate if drop down arrow should be shown in trailing section of text input, defaults to false */
showDropDownButton?: boolean;
Copy link
Member

Choose a reason for hiding this comment

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

feels like a bit of a mouthful! I don't have a better idea other than we could potentially drop show

Copy link
Contributor

Choose a reason for hiding this comment

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

I prefer dijit's hasDownArrow if that helps.

Copy link
Member

Choose a reason for hiding this comment

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

@matt-gadd That does help! Thanks, I'm sold.

Copy link
Member

@agubler agubler left a comment

Choose a reason for hiding this comment

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

A couple of comments

background: unset;

appearance: none;
-moz-appearance: none;
Copy link
Member

Choose a reason for hiding this comment

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

do we need these? doesn't the build generate these for us? cc @matt-gadd

Copy link
Member Author

Choose a reason for hiding this comment

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

It does not appear to. I just tested removing them and they are not in the end product.

Several other widgets have them in their css too.

Copy link
Member

@agubler agubler left a comment

Choose a reason for hiding this comment

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

One question but otherwise 👍

@KaneFreeman KaneFreeman merged commit d543a3f into dojo:master Apr 19, 2021
@KaneFreeman KaneFreeman deleted the feature/typeahead-select-button branch April 19, 2021 14:20
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.

Usability Typeahead widget: add select button
3 participants