@grafana/ui
Version:
Grafana Components Library
1 lines • 1.48 kB
Source Map (JSON)
{"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;;;;"}