@wordpress/block-editor/build-module/components/inserter/search-form.js

Generic block editor.

import { createElement } from "@wordpress/element";

/**
 * External dependencies
 */
import classnames from 'classnames';
/**
 * WordPress dependencies
 */

import { useInstanceId } from '@wordpress/compose';
import { __ } from '@wordpress/i18n';
import { VisuallyHidden, Button } from '@wordpress/components';
import { Icon, search, closeSmall } from '@wordpress/icons';
import { useRef } from '@wordpress/element';

function InserterSearchForm({
  className,
  onChange,
  value,
  label,
  placeholder
}) {
  const instanceId = useInstanceId(InserterSearchForm);
  const searchInput = useRef();
  return createElement("div", {
    className: classnames('block-editor-inserter__search', className)
  }, createElement(VisuallyHidden, {
    as: "label",
    htmlFor: `block-editor-inserter__search-${instanceId}`
  }, label || placeholder), createElement("input", {
    ref: searchInput,
    className: "block-editor-inserter__search-input",
    id: `block-editor-inserter__search-${instanceId}`,
    type: "search",
    placeholder: placeholder,
    onChange: event => onChange(event.target.value),
    autoComplete: "off",
    value: value || ''
  }), createElement("div", {
    className: "block-editor-inserter__search-icon"
  }, !!value && createElement(Button, {
    icon: closeSmall,
    label: __('Reset search'),
    onClick: () => {
      onChange('');
      searchInput.current.focus();
    }
  }), !value && createElement(Icon, {
    icon: search
  })));
}

export default InserterSearchForm;
//# sourceMappingURL=search-form.js.map