@grafana/ui/dist/cjs/components/FilterInput/FilterInput.cjs

Grafana Components Library

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var React = require('react');
var data = require('@grafana/data');
var i18n = require('@grafana/i18n');
var useCombinedRefs = require('../../utils/useCombinedRefs.cjs');
var Button = require('../Button/Button.cjs');
var Icon = require('../Icon/Icon.cjs');
var Input = require('../Input/Input.cjs');

"use strict";
const FilterInput = React.forwardRef(
  ({ value, width, onChange, escapeRegex = true, suffix: _suffix, ...restProps }, ref) => {
    const innerRef = React.useRef(null);
    const combinedRef = useCombinedRefs.useCombinedRefs(ref, innerRef);
    const suffix = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
      value !== "" && /* @__PURE__ */ jsxRuntime.jsx(
        Button.Button,
        {
          icon: "times",
          fill: "text",
          size: "sm",
          onClick: (e) => {
            var _a;
            (_a = innerRef.current) == null ? void 0 : _a.focus();
            onChange("");
            e.stopPropagation();
          },
          children: /* @__PURE__ */ jsxRuntime.jsx(i18n.Trans, { i18nKey: "grafana-ui.filter-input.clear", children: "Clear" })
        }
      ),
      _suffix
    ] });
    return /* @__PURE__ */ jsxRuntime.jsx(
      Input.Input,
      {
        prefix: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { name: "search" }),
        suffix,
        width,
        type: "text",
        value: escapeRegex ? data.unEscapeStringFromRegex(value != null ? value : "") : value,
        onChange: (event) => onChange(escapeRegex ? data.escapeStringForRegex(event.currentTarget.value) : event.currentTarget.value),
        ...restProps,
        ref: combinedRef
      }
    );
  }
);
FilterInput.displayName = "FilterInput";

exports.FilterInput = FilterInput;
//# sourceMappingURL=FilterInput.cjs.map