dumi-theme-antd-style/dist/slots/SearchBar/Input.js

dumi-theme-antd-style 是为 dumi2 打造的一款文档站主题包，提供了更加美观、易用的研发与阅读体验

import { useIntl } from 'dumi';
import React, { forwardRef, useImperativeHandle, useRef } from 'react';
import { jsx as _jsx } from "react/jsx-runtime";
export var Input = /*#__PURE__*/forwardRef(function (props, ref) {
  var intl = useIntl();
  var imeWaiting = useRef(false);
  var nativeInputRef = useRef(null);
  useImperativeHandle(ref, function () {
    return nativeInputRef.current;
  });
  return /*#__PURE__*/_jsx("input", {
    className: props.className,
    onCompositionStart: function onCompositionStart() {
      return imeWaiting.current = true;
    },
    onCompositionEnd: function onCompositionEnd(ev) {
      imeWaiting.current = false;
      // special case: press Enter open IME panel will not trigger onChange
      props.onChange(ev.currentTarget.value);
    },
    onFocus: props.onFocus,
    onBlur: props.onBlur,
    onKeyDown: function onKeyDown(ev) {
      if (['ArrowDown', 'ArrowUp'].includes(ev.key)) ev.preventDefault();
      // esc to blur input
      if (ev.key === 'Escape' && !imeWaiting.current) ev.currentTarget.blur();
    },
    onChange: function onChange(ev) {
      // wait for onCompositionEnd event be triggered
      setTimeout(function () {
        if (!imeWaiting.current) {
          props.onChange(ev.target.value);
        }
      }, 1);
    },
    placeholder: intl.formatMessage({
      id: 'header.search.placeholder'
    }),
    ref: nativeInputRef
  });
});