@grafana/ui/dist/esm/components/Text/TruncatedText.mjs.map

Grafana Components Library

{"version":3,"file":"TruncatedText.mjs","sources":["../../../../src/components/Text/TruncatedText.tsx"],"sourcesContent":["import { useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport * as React from 'react';\nimport ReactDOMServer from 'react-dom/server';\n\nimport { Tooltip } from '../Tooltip/Tooltip';\n\ninterface TruncatedTextProps {\n  childElement: (ref: React.ForwardedRef<HTMLElement> | undefined) => React.ReactElement;\n  children: NonNullable<React.ReactNode>;\n}\n\nexport const TruncatedText = React.forwardRef<HTMLElement, TruncatedTextProps>(({ childElement, children }, ref) => {\n  const [isOverflowing, setIsOverflowing] = useState(false);\n  const internalRef = useRef<HTMLElement>(null);\n\n  // Wire up the forwarded ref to the internal ref\n  useImperativeHandle<HTMLElement | null, HTMLElement | null>(ref, () => internalRef.current);\n\n  const resizeObserver = useMemo(\n    () =>\n      new ResizeObserver((entries) => {\n        for (const entry of entries) {\n          if (entry.target.clientWidth && entry.target.scrollWidth) {\n            if (entry.target.scrollWidth > entry.target.clientWidth) {\n              setIsOverflowing(true);\n            }\n            if (entry.target.scrollWidth <= entry.target.clientWidth) {\n              setIsOverflowing(false);\n            }\n          }\n        }\n      }),\n    []\n  );\n\n  useEffect(() => {\n    const { current } = internalRef;\n    if (current) {\n      resizeObserver.observe(current);\n    }\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [setIsOverflowing, resizeObserver]);\n\n  const getTooltipText = (children: NonNullable<React.ReactNode>) => {\n    if (typeof children === 'string') {\n      return children;\n    }\n    const html = ReactDOMServer.renderToStaticMarkup(<>{children}</>);\n    return html.replace(/(<([^>]+)>)/gi, '');\n  };\n\n  if (isOverflowing) {\n    return (\n      <Tooltip ref={internalRef} content={getTooltipText(children)}>\n        {childElement(undefined)}\n      </Tooltip>\n    );\n  } else {\n    return childElement(internalRef);\n  }\n});\n\nTruncatedText.displayName = 'TruncatedText';\n"],"names":["children"],"mappings":";;;;;;;AAWO,MAAM,aAAA,GAAgB,MAAM,UAAA,CAA4C,CAAC,EAAE,YAAA,EAAc,QAAA,IAAY,GAAA,KAAQ;AAClH,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAI,SAAS,KAAK,CAAA;AACxD,EAAA,MAAM,WAAA,GAAc,OAAoB,IAAI,CAAA;AAG5C,EAAA,mBAAA,CAA4D,GAAA,EAAK,MAAM,WAAA,CAAY,OAAO,CAAA;AAE1F,EAAA,MAAM,cAAA,GAAiB,OAAA;AAAA,IACrB,MACE,IAAI,cAAA,CAAe,CAAC,OAAA,KAAY;AAC9B,MAAA,KAAA,MAAW,SAAS,OAAA,EAAS;AAC3B,QAAA,IAAI,KAAA,CAAM,MAAA,CAAO,WAAA,IAAe,KAAA,CAAM,OAAO,WAAA,EAAa;AACxD,UAAA,IAAI,KAAA,CAAM,MAAA,CAAO,WAAA,GAAc,KAAA,CAAM,OAAO,WAAA,EAAa;AACvD,YAAA,gBAAA,CAAiB,IAAI,CAAA;AAAA,UACvB;AACA,UAAA,IAAI,KAAA,CAAM,MAAA,CAAO,WAAA,IAAe,KAAA,CAAM,OAAO,WAAA,EAAa;AACxD,YAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA,UACxB;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC,CAAA;AAAA,IACH;AAAC,GACH;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,EAAE,SAAQ,GAAI,WAAA;AACpB,IAAA,IAAI,OAAA,EAAS;AACX,MAAA,cAAA,CAAe,QAAQ,OAAO,CAAA;AAAA,IAChC;AACA,IAAA,OAAO,MAAM;AACX,MAAA,cAAA,CAAe,UAAA,EAAW;AAAA,IAC5B,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,gBAAA,EAAkB,cAAc,CAAC,CAAA;AAErC,EAAA,MAAM,cAAA,GAAiB,CAACA,SAAAA,KAA2C;AACjE,IAAA,IAAI,OAAOA,cAAa,QAAA,EAAU;AAChC,MAAA,OAAOA,SAAAA;AAAA,IACT;AACA,IAAA,MAAM,OAAO,cAAA,CAAe,oBAAA,iBAAqB,GAAA,CAAA,QAAA,EAAA,EAAG,QAAA,EAAAA,WAAS,CAAG,CAAA;AAChE,IAAA,OAAO,IAAA,CAAK,OAAA,CAAQ,eAAA,EAAiB,EAAE,CAAA;AAAA,EACzC,CAAA;AAEA,EAAA,IAAI,aAAA,EAAe;AACjB,IAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EAAQ,GAAA,EAAK,WAAA,EAAa,OAAA,EAAS,eAAe,QAAQ,CAAA,EACxD,QAAA,EAAA,YAAA,CAAa,KAAA,CAAS,CAAA,EACzB,CAAA;AAAA,EAEJ,CAAA,MAAO;AACL,IAAA,OAAO,aAAa,WAAW,CAAA;AAAA,EACjC;AACF,CAAC;AAED,aAAA,CAAc,WAAA,GAAc,eAAA;;;;"}