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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Collapsible Search Input #1464

Merged
merged 2 commits into from Feb 18, 2022
Merged

Add Collapsible Search Input #1464

merged 2 commits into from Feb 18, 2022

Conversation

joshri
Copy link
Contributor

@joshri joshri commented Feb 17, 2022

Screen.Recording.2022-02-17.at.10.29.21.AM.mov

Hey team - is this how we're envisioning the search input?

Jordan - is it worth abstracting out the icon and expand-direction portions of this component to make it more reusable?

Ignore the story description I fixed it already 馃尀

@joshri joshri added the area/ui Issues that require front-end work label Feb 17, 2022
Copy link
Contributor

@jpellizzari jpellizzari left a comment

Choose a reason for hiding this comment

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

Excellent work. I like the polish on the animation.

const CollapsibleInput = styled(Input)`
max-width: 0px;
overflow: hidden;
transition: max-width 0.5s ease;
Copy link
Contributor

Choose a reason for hiding this comment

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

馃槏

onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
setSearch(e.target.value)
}
placeholder="NAME"
Copy link
Contributor

Choose a reason for hiding this comment

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

Probably don't want this to be the default.

@joshri joshri marked this pull request as ready for review February 18, 2022 19:41
@joshri joshri merged commit d39bdb6 into v2 Feb 18, 2022
@joshri joshri deleted the search-input branch February 18, 2022 19:47
jpellizzari pushed a commit that referenced this pull request Feb 25, 2022
* created collapsed input

* resolve icon conflict
jpellizzari pushed a commit that referenced this pull request Mar 3, 2022
* created collapsed input

* resolve icon conflict
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area/ui Issues that require front-end work
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants