@grafana/ui/dist/cjs/components/Segment/useExpandableLabel.cjs

Grafana Components Library

'use strict';

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

var jsxRuntime = require('react/jsx-runtime');
var React = require('react');
var ThemeContext = require('../../themes/ThemeContext.cjs');
var Button = require('../Button/Button.cjs');

"use strict";
const useExpandableLabel = (initialExpanded, onExpandedChange) => {
  const ref = React.useRef(null);
  const buttonStyles = ThemeContext.useStyles2(Button.clearButtonStyles);
  const [expanded, setExpanded] = React.useState(initialExpanded);
  const [width, setWidth] = React.useState(0);
  const setExpandedWrapper = (expanded2) => {
    setExpanded(expanded2);
    if (onExpandedChange) {
      onExpandedChange(expanded2);
    }
  };
  const Label = ({ Component, onClick, disabled }) => /* @__PURE__ */ jsxRuntime.jsx(
    "button",
    {
      type: "button",
      className: buttonStyles,
      ref,
      disabled,
      onClick: () => {
        setExpandedWrapper(true);
        if (ref && ref.current) {
          setWidth(ref.current.clientWidth * 1.25);
        }
        onClick == null ? void 0 : onClick();
      },
      children: Component
    }
  );
  return [Label, width, expanded, setExpandedWrapper];
};

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