@grafana/ui/dist/cjs/components/Combobox/useMultiInputAutoSize.cjs

Grafana Components Library

'use strict';

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

var React = require('react');
var measureText = require('../../utils/measureText.cjs');

"use strict";
function useMultiInputAutoSize(inputValue) {
  const inputRef = React.useRef(null);
  const initialInputWidth = React.useRef(0);
  const [inputWidth, setInputWidth] = React.useState("");
  React.useLayoutEffect(() => {
    if (inputRef.current && inputValue == null && initialInputWidth.current === 0) {
      initialInputWidth.current = inputRef == null ? void 0 : inputRef.current.getBoundingClientRect().width;
    }
    if (!inputRef.current || inputValue == null) {
      setInputWidth("");
      return;
    }
    const fontSize = window.getComputedStyle(inputRef.current).fontSize;
    const textWidth = measureText.measureText(inputRef.current.value || "", parseInt(fontSize, 10)).width;
    if (textWidth < initialInputWidth.current) {
      setInputWidth("");
    } else {
      setInputWidth(`${textWidth + 5}px`);
    }
  }, [inputValue]);
  return { inputRef, inputWidth };
}

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