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(SearchBox): Add Search Box #863

Merged
merged 138 commits into from
May 10, 2023
Merged

feat(SearchBox): Add Search Box #863

merged 138 commits into from
May 10, 2023

Conversation

gretanausedaite
Copy link
Contributor

@gretanausedaite gretanausedaite commented Dec 19, 2022

Changes

image

CSS

  • Add iui-input-flex-container
  • Add searchbox and expanded searchbox styles

React

  • Add InputFlexContainer util component
  • Add SearchBox component
  • Add subcomponents:
    • ExpandedState
    • CollapsedState
    • Input
    • Button
    • ExpandButton
    • CollapseButton
    • Icon

Testing

  • Visual tests
  • Unit tests

Documentation

  • jsdocs
  • documentation website - will be done in next PR
  • changeset

@gretanausedaite gretanausedaite self-assigned this Dec 19, 2022
@FlyersPh9 FlyersPh9 linked an issue Dec 20, 2022 that may be closed by this pull request
@gretanausedaite gretanausedaite marked this pull request as ready for review January 17, 2023 13:25
@gretanausedaite gretanausedaite requested a review from a team as a code owner January 17, 2023 13:25

return (
<Icon
aria-hidden
className={cx('iui-search-icon', className)}
size={sizeContext}
Copy link
Contributor

@mayank99 mayank99 May 9, 2023

Choose a reason for hiding this comment

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

is this intentional?

Before Now
small icon medium icon

edit: Greta said it is to match borderless button which uses 16x16 icon even with small size

packages/itwinui-css/src/searchbox/searchbox.scss Outdated Show resolved Hide resolved
packages/itwinui-css/src/searchbox/searchbox.scss Outdated Show resolved Hide resolved
mayank99 and others added 2 commits May 9, 2023 12:22
@mayank99 mayank99 force-pushed the greta/search-box branch from d154b22 to 147b049 Compare May 9, 2023 16:27
mayank99 and others added 2 commits May 9, 2023 12:32
Copy link
Contributor

@mayank99 mayank99 left a comment

Choose a reason for hiding this comment

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

LGTM 🚀

Copy link
Contributor

@elephantcatdog elephantcatdog left a comment

Choose a reason for hiding this comment

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

Looks pretty good to me, just found one thing to fix

* Id to pass to input
*/
inputId: string;
setInputId: (inputId: string) => void;
Copy link
Contributor

Choose a reason for hiding this comment

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

setInputId is missing a comment

Copy link
Contributor Author

Choose a reason for hiding this comment

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

It is for context so internal use only.
Added comment.

<Divider orientation='vertical' />
<SearchBox.CollapseButton />
</SearchBox.ExpandedState>
</SearchBox>
Copy link
Contributor

Choose a reason for hiding this comment

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

The composition looks nice in use : )

@gretanausedaite gretanausedaite enabled auto-merge May 10, 2023 14:22
@gretanausedaite gretanausedaite added this pull request to the merge queue May 10, 2023
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks May 10, 2023
@gretanausedaite gretanausedaite added this pull request to the merge queue May 10, 2023
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks May 10, 2023
@gretanausedaite gretanausedaite enabled auto-merge May 10, 2023 15:14
@gretanausedaite gretanausedaite disabled auto-merge May 10, 2023 15:15
@gretanausedaite gretanausedaite merged commit 267a7a4 into main May 10, 2023
@gretanausedaite gretanausedaite deleted the greta/search-box branch May 10, 2023 15:15
@imodeljs-admin imodeljs-admin mentioned this pull request May 10, 2023
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.

Search Box
5 participants