{"version":3,"file":"XYCanvas.mjs","sources":["../../../../../src/components/uPlot/geometries/XYCanvas.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useMemo } from 'react';\nimport * as React from 'react';\n\nimport { selectors } from '@grafana/e2e-selectors';\n\ninterface XYCanvasProps {\n  top: number; // css pxls\n  left: number; // css pxls\n}\n\n/**\n * Renders absolutely positioned element on top of the uPlot's plotting area (axes are not included!).\n * Useful when you want to render some overlay with canvas-independent elements on top of the plot.\n */\nexport const XYCanvas = ({ children, left, top }: React.PropsWithChildren<XYCanvasProps>) => {\n  const className = useMemo(() => {\n    return css({\n      position: 'absolute',\n      overflow: 'visible',\n      left: `${left}px`,\n      top: `${top}px`,\n    });\n  }, [left, top]);\n\n  return (\n    <div data-testid={selectors.components.UPlotChart.xyCanvas} className={className}>\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAeO,MAAM,WAAW,CAAC,EAAE,QAAA,EAAU,IAAA,EAAM,KAAI,KAA8C;AAC3F,EAAA,MAAM,SAAA,GAAY,QAAQ,MAAM;AAC9B,IAAA,OAAO,GAAA,CAAI;AAAA,MACT,QAAA,EAAU,UAAA;AAAA,MACV,QAAA,EAAU,SAAA;AAAA,MACV,IAAA,EAAM,GAAG,IAAI,CAAA,EAAA,CAAA;AAAA,MACb,GAAA,EAAK,GAAG,GAAG,CAAA,EAAA;AAAA,KACZ,CAAA;AAAA,EACH,CAAA,EAAG,CAAC,IAAA,EAAM,GAAG,CAAC,CAAA;AAEd,EAAA,uBACE,GAAA,CAAC,SAAI,aAAA,EAAa,SAAA,CAAU,WAAW,UAAA,CAAW,QAAA,EAAU,WACzD,QAAA,EACH,CAAA;AAEJ;;;;"}