{"version":3,"file":"Preview.cjs","sources":["../../../../src/components/visual-query-builder/Preview.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useCopyToClipboard } from 'react-use';\n\nimport { type GrafanaTheme2 } from '@grafana/data';\nimport { Trans, t } from '@grafana/i18n';\nimport { reportInteraction } from '@grafana/runtime';\nimport { CodeEditor, Field, IconButton, useStyles2 } from '@grafana/ui';\n\nimport { formatSQL } from '../../utils/formatSQL';\n\ntype PreviewProps = {\n  rawSql: string;\n  datasourceType?: string;\n};\n\nexport function Preview({ rawSql, datasourceType }: PreviewProps) {\n  // TODO: use zero index to give feedback about copy success\n  const [_, copyToClipboard] = useCopyToClipboard();\n  const styles = useStyles2(getStyles);\n\n  const copyPreview = (rawSql: string) => {\n    copyToClipboard(rawSql);\n    reportInteraction('grafana_sql_preview_copied', {\n      datasource: datasourceType,\n    });\n  };\n\n  const labelElement = (\n    <div className={styles.labelWrapper}>\n      <span className={styles.label}>\n        <Trans i18nKey=\"grafana-sql.components.preview.label-element.preview\">Preview</Trans>\n      </span>\n      <IconButton\n        tooltip={t('grafana-sql.components.preview.label-element.tooltip-copy-to-clipboard', 'Copy to clipboard')}\n        onClick={() => copyPreview(rawSql)}\n        name=\"copy\"\n      />\n    </div>\n  );\n\n  return (\n    <Field label={labelElement} className={styles.grow}>\n      <CodeEditor\n        language=\"sql\"\n        height={80}\n        value={formatSQL(rawSql)}\n        monacoOptions={{ scrollbar: { vertical: 'hidden' }, scrollBeyondLastLine: false }}\n        readOnly={true}\n        showMiniMap={false}\n      />\n    </Field>\n  );\n}\n\nfunction getStyles(theme: GrafanaTheme2) {\n  return {\n    grow: css({ flexGrow: 1 }),\n    label: css({ fontSize: 12, fontWeight: theme.typography.fontWeightMedium }),\n    labelWrapper: css({ display: 'flex', justifyContent: 'space-between', paddingBottom: theme.spacing(0.5) }),\n  };\n}\n"],"names":["useCopyToClipboard","useStyles2","rawSql","reportInteraction","jsxs","jsx","Trans","IconButton","t","Field","CodeEditor","formatSQL","css"],"mappings":";;;;;;;;;;;;;AAeO,SAAS,OAAA,CAAQ,EAAE,MAAA,EAAQ,cAAA,EAAe,EAAiB;AAEhE,EAAA,MAAM,CAAC,CAAA,EAAG,eAAe,CAAA,GAAIA,2BAAA,EAAmB;AAChD,EAAA,MAAM,MAAA,GAASC,cAAW,SAAS,CAAA;AAEnC,EAAA,MAAM,WAAA,GAAc,CAACC,OAAAA,KAAmB;AACtC,IAAA,eAAA,CAAgBA,OAAM,CAAA;AACtB,IAAAC,yBAAA,CAAkB,4BAAA,EAA8B;AAAA,MAC9C,UAAA,EAAY;AAAA,KACb,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,MAAM,YAAA,mBACJC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,YAAA,EACrB,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,MAAA,EAAA,EAAK,WAAW,MAAA,CAAO,KAAA,EACtB,yCAACC,UAAA,EAAA,EAAM,OAAA,EAAQ,sDAAA,EAAuD,QAAA,EAAA,SAAA,EAAO,CAAA,EAC/E,CAAA;AAAA,oBACAD,cAAA;AAAA,MAACE,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAASC,MAAA,CAAE,wEAAA,EAA0E,mBAAmB,CAAA;AAAA,QACxG,OAAA,EAAS,MAAM,WAAA,CAAY,MAAM,CAAA;AAAA,QACjC,IAAA,EAAK;AAAA;AAAA;AACP,GAAA,EACF,CAAA;AAGF,EAAA,sCACGC,QAAA,EAAA,EAAM,KAAA,EAAO,YAAA,EAAc,SAAA,EAAW,OAAO,IAAA,EAC5C,QAAA,kBAAAJ,cAAA;AAAA,IAACK,aAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAS,KAAA;AAAA,MACT,MAAA,EAAQ,EAAA;AAAA,MACR,KAAA,EAAOC,oBAAU,MAAM,CAAA;AAAA,MACvB,aAAA,EAAe,EAAE,SAAA,EAAW,EAAE,UAAU,QAAA,EAAS,EAAG,sBAAsB,KAAA,EAAM;AAAA,MAChF,QAAA,EAAU,IAAA;AAAA,MACV,WAAA,EAAa;AAAA;AAAA,GACf,EACF,CAAA;AAEJ;AAEA,SAAS,UAAU,KAAA,EAAsB;AACvC,EAAA,OAAO;AAAA,IACL,IAAA,EAAMC,OAAA,CAAI,EAAE,QAAA,EAAU,GAAG,CAAA;AAAA,IACzB,KAAA,EAAOA,QAAI,EAAE,QAAA,EAAU,IAAI,UAAA,EAAY,KAAA,CAAM,UAAA,CAAW,gBAAA,EAAkB,CAAA;AAAA,IAC1E,YAAA,EAAcA,OAAA,CAAI,EAAE,OAAA,EAAS,MAAA,EAAQ,cAAA,EAAgB,eAAA,EAAiB,aAAA,EAAe,KAAA,CAAM,OAAA,CAAQ,GAAG,CAAA,EAAG;AAAA,GAC3G;AACF;;;;"}