* Add label and button to search box and convert to functional component

* Correct lodash import

* Turn statements into sentence fragments
* Add appropriate landmark roles for elements
* Set portaled widget as a search form
* Use ordered list for search results

…13968)

* [not verified] Add product search result component

* [not verified] Refactor renderResult into component

* [not verified] Convert SearchResult to stateless functional component

* [not verified] Move comments to new shared component

* [not verified] Move Tracks out to common SearchResult

* [not verified] Request additional fields for product results

* Correct field names and remove ratings for now

* Basic styling of cards with images

* Add price where available

* Read result_format from the query string

* Use ordered list

* Style cleanup

* Minor cleanup

* Remove resultFormat from component state

* SearchResults component cleanup

* Standardise class names

* Validate result format before using as CSS class

* Address review nits

* Add PhotonImage component

* Bump default dimensions to 300x300

* Bump asset size limit to 100kb

…14133)

* Add label and button to search box and convert to functional component

* Correct lodash import

* Turn statements into sentence fragments
* Add appropriate landmark roles for elements
* Set portaled widget as a search form
* Use ordered list for search results

…13968)

* [not verified] Add product search result component

* [not verified] Refactor renderResult into component

* [not verified] Convert SearchResult to stateless functional component

* [not verified] Move comments to new shared component

* [not verified] Move Tracks out to common SearchResult

* [not verified] Request additional fields for product results

* Correct field names and remove ratings for now

* Basic styling of cards with images

* Add price where available

* Read result_format from the query string

* Use ordered list

* Style cleanup

* Minor cleanup

* Remove resultFormat from component state

* SearchResults component cleanup

* Standardise class names

* Validate result format before using as CSS class

* Address review nits

* Add PhotonImage component

* Bump default dimensions to 300x300

* Bump asset size limit to 100kb

…14133)

… into instant-search-master

* Instant Search: use default values for getting results to avoid duplication

* getResults: default to empty object

Co-Authored-By: Jason Moon <4044428+jsnmoon@users.noreply.github.com>

* Split search form out of widget component so it can be reused in the main search area

* Include search form in main content area

* Move sort wrapper into component and improve class name

* Give sort component a more sensible name

* Keep search form in place when there are no results

* Just return null when there isn't a query

* Combine pagination conditionals into one clause

Co-Authored-By: Jason Moon <4044428+jsnmoon@users.noreply.github.com>

* Drop SearchResultsEmpty component

* Tidy pagination logic

* Pass all props down to SearchForm

* Add filter icon

* Simple show/hide toggle

* Make it an interactive element

* Add aria-hidden to gridicon

* Fix invisible space breaking date layout
* Restore info Gridicon
* Add warning notice component
* Check offline state before using short term cache
* Inject cache state variables into response data
* Show “cached results” notice when the user is offline
* Catch connectivity error and notify the user
* Show correct number of results when offline
* Hide load more button when offline
* Wrap new copy in translation calls

* Try the overlay (Hotel California edition)

* Add button to close overlay

* Always display search form attached to search results

* Add a note about portaled search inputs

* Use showResults instead of using showOverlay value

* Add a large z-index and increase opacity

* Simplify SearchApp, trigger overlay on input focus

* Disable WordPress Search for Instant Search

* Revert "Disable WordPress Search for Instant Search"

This reverts commit 65b7dcb.

* Add jetpack namespace to translation

Co-Authored-By: Jason Moon <4044428+jsnmoon@users.noreply.github.com>

* Use the searchInputSelector

Co-Authored-By: Jason Moon <4044428+jsnmoon@users.noreply.github.com>

* Add missing quote

* Add preact-testing-library

* Rebase

* Add instant-search dir to existing Jest config

* First attempt at test

* Tidying

* Create 'yarn test-search'

* Remove package-lock.json

* Add jsx pragma

* [not verified]

* Enable test and added dependency docblocks

* Remove rogue Slack package

* Remove focus event listeners

* Respond to submit rather than focus

* Allow enter key to launch overlay

* Reflect widget search input changes in query string

* Close overlay with Esc key

* Reflect query string change in search widget input

* Make sure the sort options match

* Try grabbing focus in getResults

* Remove focus code

* Remove grabFocus (no longer in use)

* Handle overlay escape key with useEffect rather than converting to Component

* Move closeOnEscapeKey out of render

* Fix linting violations by changing `date` invocations to `gmdate`
* Add sidebar widget area
* Add SearchSidebar component
* Integrate SearchSidebar into SearchResults
* Implement Overlay animation from design prototype

…4284)

- refactor php to extract all instant search code
- add customizer for the overlay
- add running the search query on the backend to display filters when the page loads.

* Instant Search: prevent Esc from opening overlay

* Use isVisible rather than shouldShowOverlay

* Add SearchFilters above SearchSidebar
* Instant Search: Add a button to clear applied filters (#14324)
  * Add function to clear filter query values
  * Fix class names for elements in SearchFilter
  * Add “Clear Filters” button

* Introduce overlay from right

* Updating overlay offset values

- Changes units from `vh` to `vw`.
- Updates value from `200` to `100`, as [mentioned here](#14320 (comment)).

Co-authored-by: Filipe Varela <keoshi@keoshi.com>

…14360)

* Add search filter portaling inside overlay sidebar
* Update readme with new testing instructions

* Make search input as large as possible

* Remove opinionated styles

* Add more margin to the filter icon

* Add screen reader text for the search box

* Change order of date element

* Change date position

* Clean up styles

* Update style for comments in search results

* Fix name of CSS property

* Make search result title class more specific

Also reorders styles

See: #14379 (comment)

* Remove extra screen reader text

See: #14379 (comment)

* Integrate customizer options for search overlay
* Fix infinite scroll functionality

* Update styles for base overlay
* Update styles for search results

* Move focus to and from overlay
* Use useRef and event listeners for focus shifting

Co-authored-by: Chris R <chris@bluefuton.com>

* Instant Search: use taxonomy name rather than slug

* Fix display of category filters

* Update buildFilterObject()

…taxonomies, tags and categories (#14492)

* Switch to use .slug_slash_name for taxonomies, tags and categories

* Use slug in the query, and name for display

* Add cross gridicon

* Replace close button label by a gridicon

* Change position of close button

* Update z-index stacking order

Prevents sidebar to be in front of the close button

* Reorder CSS properties

* Add medium break point at 768px

* Add mobile styles for filters popover

* Change how transparency is set on the overlay

* Update break-small to break-medium

* Add styles for smaller close button on mobile devices

* Add arrow element to popover

* Remove styles that are out of place

Given the markup has changed in #14477, these styles need to be applied elsewhere

* Update search results styling

* Add popover styles

* Update filter icon margins

* Show sidebar filters up to 768px

See: #14423 (review)

* Bring up the opacity on the arrow border

* Reduce side padding on small screens

* Move margin to label span instead of select element

* Restore initial href when closing overlay
* Fix incorrect inline style removal

- Refactor filter display for front end
- Remove rendering filters in the overlay
- Front end filters open the overlay

* Show JetpackColophon when setting is activated

* Translate text

* Added logo and styles

* Style tweaks

* Link to jetpack.com/search

* Add colophon to mobile filters

* Margin tweak

…earch-master

* Clear search and filter queries if necessary
* Improve initialHref restoration function
* Create a separate handler for popstate events

…earch-master

* Only return widgets inside the overlay sidebar
* Remove overlay sidebar membership check in JS