df31a94f2e
* Prep work to sync mobile search in #10424 * Added a comment about the custom search event. * Refactor to fix already defined error caused by const and InstantClick. * Moved <SearchFormSync /> out of the pack file. * Fixed broken tests. * Renamed getInitialSearchTerm utility function to getSearchTermFromUrl * Added some API docs to getSearchTermFromUrl * Fixed a typo. * Added some more API docs. * Switched to a custom event so a custom payload can be passed. * Added some API docs. * Fixed bad destructuring statement. * wip for some more tests. * Refactored getSearchTermFromUrl to use URLSearchParams * lazy loaded state for search term initial value. * test broken still. Need to think on it. * filterXSS is now set up in testSetup.js * Fixed tests. * Added the @utilities alias to Storybooks webpack config. * Almost 100% coverage with two useful tests. * Added some comments explaining document.body usage in the tests. * Fixed issue where search attemps to get results on first load. * Small refactor for setting the window.location in tests. * Clarified an explanation in a comment.
33 lines
837 B
JavaScript
33 lines
837 B
JavaScript
import PropTypes from 'prop-types';
|
|
import { h } from 'preact';
|
|
import { forwardRef } from 'preact/compat';
|
|
|
|
export const SearchForm = forwardRef(
|
|
({ searchTerm, onSearch, onSubmitSearch }, ref) => (
|
|
<form
|
|
action="/search"
|
|
acceptCharset="UTF-8"
|
|
method="get"
|
|
onSubmit={onSubmitSearch}
|
|
>
|
|
<input name="utf8" type="hidden" value="✓" />
|
|
<input
|
|
ref={ref}
|
|
className="crayons-header--search-input crayons-textfield"
|
|
type="text"
|
|
name="q"
|
|
placeholder="Search..."
|
|
autoComplete="off"
|
|
aria-label="search"
|
|
onKeyDown={onSearch}
|
|
value={searchTerm}
|
|
/>
|
|
</form>
|
|
),
|
|
);
|
|
|
|
SearchForm.propTypes = {
|
|
searchTerm: PropTypes.string.isRequired,
|
|
onSearch: PropTypes.func.isRequired,
|
|
onSubmitSearch: PropTypes.func.isRequired,
|
|
};
|