spectrum-web-components icon indicating copy to clipboard operation
spectrum-web-components copied to clipboard

[Feat]: collapsed state for <sp-search>

Open hunterloftis opened this issue 3 years ago • 0 comments

Code of conduct

  • [X] I agree to follow this project's code of conduct.

Impacted component(s)

sp-search

Description of the requested feature

<sp-search> should accept a collapsed attribute that modifies its appearance - hiding everything but a clickable search icon when the search element is not focused.

Transitions between collapsed and uncollapsed states should be smooth:

When clicked on, the search icon expands out to a field.

  • https://spectrum.adobe.com/page/headers/#Search

Mockups or screenshots

image

Implementation notes or ideas

Component styling should flow from spectrum-css (/cc @GarthDB @pfulton). The spec for this is currently only a sentence and a single image, so we should loop in design to get clarification on the details of this in the spectrum design system.

hunterloftis avatar Dec 02 '21 23:12 hunterloftis