Line data    Source code

       1              : import * as React from 'react';
       2              : 
       3              : import { QueryExecutionState } from '../../query/query_execution_state.js';
       4              : import { ResolvedVisualizeQuery } from '../../session/scripts/script_types.js';
       5              : import { VegaLiteView } from './vegalite_view.js';
       6              : import { VegaLitePreview } from './vegalite_preview.js';
       7              : import { MarkdownView } from './markdown_view.js';
       8              : import { QueryResultView } from '../query_result/query_result_view.js';
       9              : import { TableColumnHeader } from '../query_result/data_table_cell.js';
      10              : 
      11              : interface Props {
      12              :     query: QueryExecutionState | null;
      13              :     visualizeQuery: ResolvedVisualizeQuery | null;
      14              :     /// Optional exact chart width/height in px. Currently honored by the Vega-Lite renderer (sizes
      15              :     /// the whole plot to `fit`).
      16              :     width?: number;
      17              :     height?: number;
      18              :     /// Optional uniform scale (<1 shrinks fonts/marks/axes). Honored by the Vega-Lite renderer.
      19              :     scale?: number;
      20              :     /// Suppress legends (they crowd out a cramped host like a grid card). Honored by the Vega-Lite
      21              :     /// renderer.
      22              :     hideLegend?: boolean;
      23              :     /// Render a Vega-Lite chart as a preview into the width×height box, see `VegaLitePreview`
      24              :     preview?: boolean;
      25              : }
      26              : 
      27              : /// Renders the visualization of a query with `@vis` tags, dispatching on the
      28              : /// renderer named by the tag. Vega-Lite goes to the vega-embed VegaLiteView.
      29            1 : export function VisualizationDispatch(props: Props): React.ReactElement | null {
      30            1 :     const vq = props.visualizeQuery;
      31            1 :     if (vq == null) {
      32            0 :         return <VegaLiteView query={props.query} vegaLiteSpec={null} />;
      33              :     }
      34            1 :     switch (vq.renderer) {
      35            1 :         case 'vegalite':
      36            1 :             if (props.preview && props.width != null && props.height != null) {
      37            0 :                 return <VegaLitePreview query={props.query} vegaLiteSpec={vq.vegaLiteSpec} width={props.width} height={props.height} />;
      38              :             }
      39            1 :             return <VegaLiteView query={props.query} vegaLiteSpec={vq.vegaLiteSpec} width={props.width} height={props.height} scale={props.scale} hideLegend={props.hideLegend} />;
      40            0 :         case 'markdown':
      41            0 :             return <MarkdownView query={props.query} spec={vq.markdownSpec} />;
      42            0 :         case 'table':
      43            0 :             return (
      44            0 :                 <QueryResultView
      45            0 :                     query={props.query}
      46            0 :                     debugMode={false}
      47            0 :                     columnHeader={TableColumnHeader.OnlyColumnName}
      48            0 :                     fitHeight={false}
      49            0 :                     compact
      50            0 :                 />
      51              :             );
      52            1 :     }
      53            1 : }