@talend/react-components/lib-esm/ListView/Header/HeaderInput.component.js

Set of react components.

import PropTypes from 'prop-types';
import classNames from 'classnames';
import { withTranslation } from 'react-i18next';
import I18N_DOMAIN_COMPONENTS from '../../constants';
import getDefaultT from '../../translate';
import Action from '../../Actions/Action';
import theme from './Header.module.scss';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
let inputRef;
function headerClasses() {
  return classNames(theme['tc-listview-header'], 'tc-listview-header');
}
function getAction(action, index) {
  function onClick(event) {
    if (action.onClick) {
      action.onClick(event, {
        value: inputRef.value
      });
    }
  }
  return /*#__PURE__*/_jsx(Action, {
    label: action.label,
    icon: action.icon,
    onClick: onClick,
    disabled: action.disabled,
    tooltipPlacement: "bottom",
    inProgress: action.inProgress,
    hideLabel: true,
    link: true
  }, `${index}-listview-header-action`);
}
function HeaderInput({
  headerInput,
  onInputChange,
  inputPlaceholder,
  onAddKeyDown,
  t
}) {
  const computedInputPlaceholder = inputPlaceholder || t('LISTVIEW_HEADERINPUT_SEARCH_PLACEHOLDER', {
    defaultValue: 'Search'
  });
  function onInputChangeHandler(event) {
    onInputChange(event, {
      value: event.target.value
    });
  }
  function onAddKeyDownHandler(event) {
    onAddKeyDown(event, {
      value: event.target.value
    });
  }
  return /*#__PURE__*/_jsxs("header", {
    className: headerClasses(),
    children: [/*#__PURE__*/_jsx("input", {
      type: "text",
      placeholder: computedInputPlaceholder,
      ref: input => {
        inputRef = input;
      },
      onChange: onInputChangeHandler,
      onKeyDown: onAddKeyDownHandler,
      "aria-label": computedInputPlaceholder,
      autoFocus: true
    }), headerInput.map(getAction)]
  });
}
HeaderInput.propTypes = {
  headerInput: PropTypes.arrayOf(PropTypes.shape(Action.propTypes)).isRequired,
  onInputChange: PropTypes.func,
  inputPlaceholder: PropTypes.string,
  onAddKeyDown: PropTypes.func,
  t: PropTypes.func
};
HeaderInput.defaultProps = {
  t: getDefaultT()
};
export default withTranslation(I18N_DOMAIN_COMPONENTS)(HeaderInput);
//# sourceMappingURL=HeaderInput.component.js.map