[XY] Expression chart.

.github/CODEOWNERS

@@ -41,6 +41,7 @@
 /src/plugins/chart_expressions/expression_heatmap/ @elastic/kibana-vis-editors
 /src/plugins/chart_expressions/expression_gauge/ @elastic/kibana-vis-editors
 /src/plugins/chart_expressions/expression_partition_vis/ @elastic/kibana-vis-editors
+/src/plugins/chart_expressions/expression_xy/ @elastic/kibana-vis-editors
 /src/plugins/url_forwarding/ @elastic/kibana-vis-editors
 /packages/kbn-tinymath/ @elastic/kibana-vis-editors
 /x-pack/test/functional/apps/lens @elastic/kibana-vis-editors

.i18nrc.json

@@ -26,6 +26,7 @@
     "expressionMetric": "src/plugins/expression_metric",
     "expressionMetricVis": "src/plugins/chart_expressions/expression_metric",
     "expressionPartitionVis": "src/plugins/chart_expressions/expression_partition_vis",
+    "expressionXY": "src/plugins/chart_expressions/expression_xy",
     "expressionRepeatImage": "src/plugins/expression_repeat_image",
     "expressionRevealImage": "src/plugins/expression_reveal_image",
     "expressions": "src/plugins/expressions",

docs/developer/plugin-list.asciidoc

@@ -160,6 +160,10 @@ for use in their own application.
 |Expression Tagcloud plugin adds a tagcloud renderer and function to the expression plugin. The renderer will display the Wordcloud chart.
 
 
+|{kib-repo}blob/{branch}/src/plugins/chart_expressions/expression_xy/README.md[expressionXY]
+|A Kibana plugin
+
+
 |{kib-repo}blob/{branch}/src/plugins/field_formats/README.md[fieldFormats]
 |Index pattern fields formatters
 

packages/kbn-optimizer/limits.yml

@@ -124,3 +124,4 @@ pageLoadAssetSize:
   sessionView: 77750
   cloudSecurityPosture: 19109
   visTypeGauge: 24113
+  expressionXY: 41392

src/plugins/chart_expressions/expression_xy/README.md

@@ -0,0 +1,9 @@
+# expressionXY
+
+A Kibana plugin
+
+---
+
+## Development
+
+See the [kibana contributing guide](https://github.com/elastic/kibana/blob/main/CONTRIBUTING.md) for instructions setting up your development environment.

src/plugins/chart_expressions/expression_xy/common/__mocks__/index.ts

@@ -0,0 +1,128 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { Position } from '@elastic/charts';
+import { PaletteOutput } from 'src/plugins/charts/common';
+import { Datatable, DatatableRow } from 'src/plugins/expressions';
+import { LayerTypes } from '../constants';
+import { DataLayerConfigResult, LensMultiTable, XYArgs } from '../types';
+
+export const mockPaletteOutput: PaletteOutput = {
+  type: 'palette',
+  name: 'mock',
+  params: {},
+};
+
+export const createSampleDatatableWithRows = (rows: DatatableRow[]): Datatable => ({
+  type: 'datatable',
+  columns: [
+    {
+      id: 'a',
+      name: 'a',
+      meta: { type: 'number', params: { id: 'number', params: { pattern: '0,0.000' } } },
+    },
+    {
+      id: 'b',
+      name: 'b',
+      meta: { type: 'number', params: { id: 'number', params: { pattern: '000,0' } } },
+    },
+    {
+      id: 'c',
+      name: 'c',
+      meta: {
+        type: 'date',
+        field: 'order_date',
+        sourceParams: { type: 'date-histogram', params: { interval: 'auto' } },
+        params: { id: 'string' },
+      },
+    },
+    { id: 'd', name: 'ColD', meta: { type: 'string' } },
+  ],
+  rows,
+});
+
+export const sampleLayer: DataLayerConfigResult = {
+  type: 'dataLayer',
+  layerId: 'first',
+  layerType: LayerTypes.DATA,
+  seriesType: 'line',
+  xAccessor: 'c',
+  accessors: ['a', 'b'],
+  splitAccessor: 'd',
+  columnToLabel: '{"a": "Label A", "b": "Label B", "d": "Label D"}',
+  xScaleType: 'ordinal',
+  yScaleType: 'linear',
+  isHistogram: false,
+  palette: mockPaletteOutput,
+};
+
+export const createArgsWithLayers = (layers: DataLayerConfigResult[] = [sampleLayer]): XYArgs => ({
+  xTitle: '',
+  yTitle: '',
+  yRightTitle: '',
+  legend: {
+    type: 'legendConfig',
+    isVisible: false,
+    position: Position.Top,
+  },
+  valueLabels: 'hide',
+  valuesInLegend: false,
+  axisTitlesVisibilitySettings: {
+    type: 'axisTitlesVisibilityConfig',
+    x: true,
+    yLeft: true,
+    yRight: true,
+  },
+  tickLabelsVisibilitySettings: {
+    type: 'tickLabelsConfig',
+    x: true,
+    yLeft: false,
+    yRight: false,
+  },
+  labelsOrientation: {
+    type: 'labelsOrientationConfig',
+    x: 0,
+    yLeft: -90,
+    yRight: -45,
+  },
+  gridlinesVisibilitySettings: {
+    type: 'gridlinesConfig',
+    x: true,
+    yLeft: false,
+    yRight: false,
+  },
+  yLeftExtent: {
+    mode: 'full',
+    type: 'axisExtentConfig',
+  },
+  yRightExtent: {
+    mode: 'full',
+    type: 'axisExtentConfig',
+  },
+  layers,
+});
+
+export function sampleArgs() {
+  const data: LensMultiTable = {
+    type: 'lens_multitable',
+    tables: {
+      first: createSampleDatatableWithRows([
+        { a: 1, b: 2, c: 'I', d: 'Foo' },
+        { a: 1, b: 5, c: 'J', d: 'Bar' },
+      ]),
+    },
+    dateRange: {
+      fromDate: new Date('2019-01-02T05:00:00.000Z'),
+      toDate: new Date('2019-01-03T05:00:00.000Z'),
+    },
+  };
+
+  const args: XYArgs = createArgsWithLayers();
+
+  return { data, args };
+}

src/plugins/chart_expressions/expression_xy/common/constants.ts

@@ -0,0 +1,103 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+export const XY_VIS = 'xyVis';
+export const Y_CONFIG = 'yConfig';
+export const MULTITABLE = 'lens_multitable';
+export const DATA_LAYER = 'dataLayer';
+export const LEGEND_CONFIG = 'legendConfig';
+export const XY_VIS_RENDERER = 'xyVis';
+export const GRID_LINES_CONFIG = 'gridlinesConfig';
+export const TICK_LABELS_CONFIG = 'tickLabelsConfig';
+export const AXIS_EXTENT_CONFIG = 'axisExtentConfig';
+export const REFERENCE_LINE_LAYER = 'referenceLineLayer';
+export const LABELS_ORIENTATION_CONFIG = 'labelsOrientationConfig';
+export const AXIS_TITLES_VISIBILITY_CONFIG = 'axisTitlesVisibilityConfig';
+
+export const LayerTypes = {
+  DATA: 'data',
+  REFERENCELINE: 'referenceLine',
+} as const;
+
+export const FittingFunctions = {
+  NONE: 'None',
+  ZERO: 'Zero',
+  LINEAR: 'Linear',
+  CARRY: 'Carry',
+  LOOKAHEAD: 'Lookahead',
+} as const;
+
+export const YAxisModes = {
+  AUTO: 'auto',
+  LEFT: 'left',
+  RIGHT: 'right',
+  BOTTOM: 'bottom',
+} as const;
+
+export const AxisExtentModes = {
+  FULL: 'full',
+  CUSTOM: 'custom',
+  DATA_BOUNDS: 'dataBounds',
+} as const;
+
+export const LineStyles = {
+  SOLID: 'solid',
+  DASHED: 'dashed',
+  DOTTED: 'dotted',
+} as const;
+
+export const FillStyles = {
+  NONE: 'none',
+  ABOVE: 'above',
+  BELOW: 'below',
+} as const;
+
+export const IconPositions = {
+  AUTO: 'auto',
+  LEFT: 'left',
+  RIGHT: 'right',
+  ABOVE: 'above',
+  BELOW: 'below',
+} as const;
+
+export const SeriesTypes = {
+  BAR: 'bar',
+  LINE: 'line',
+  AREA: 'area',
+  BAR_STACKED: 'bar_stacked',
+  AREA_STACKED: 'area_stacked',
+  BAR_HORIZONTAL: 'bar_horizontal',
+  BAR_PERCENTAGE_STACKED: 'bar_percentage_stacked',
+  BAR_HORIZONTAL_STACKED: 'bar_horizontal_stacked',
+  AREA_PERCENTAGE_STACKED: 'area_percentage_stacked',
+  BAR_HORIZONTAL_PERCENTAGE_STACKED: 'bar_horizontal_percentage_stacked',
+} as const;
+
+export const YScaleTypes = {
+  TIME: 'time',
+  LINEAR: 'linear',
+  LOG: 'log',
+  SQRT: 'sqrt',
+} as const;
+
+export const XScaleTypes = {
+  TIME: 'time',
+  LINEAR: 'linear',
+  ORDINAL: 'ordinal',
+} as const;
+
+export const XYCurveTypes = {
+  LINEAR: 'LINEAR',
+  CURVE_MONOTONE_X: 'CURVE_MONOTONE_X',
+} as const;
+
+export const ValueLabelModes = {
+  HIDE: 'hide',
+  INSIDE: 'inside',
+  OUTSIDE: 'outside',
+} as const;

src/plugins/chart_expressions/expression_xy/common/expression_functions/axis_extent_config.ts

@@ -0,0 +1,54 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { i18n } from '@kbn/i18n';
+import type { ExpressionFunctionDefinition } from '../../../../expressions/common';
+import { AxisExtentConfig, AxisExtentConfigResult } from '../types';
+import { AxisExtentModes, AXIS_EXTENT_CONFIG } from '../constants';
+
+export const axisExtentConfigFunction: ExpressionFunctionDefinition<
+  typeof AXIS_EXTENT_CONFIG,
+  null,
+  AxisExtentConfig,
+  AxisExtentConfigResult
+> = {
+  name: AXIS_EXTENT_CONFIG,
+  aliases: [],
+  type: AXIS_EXTENT_CONFIG,
+  help: i18n.translate('expressionXY.axisExtentConfig.help', {
+    defaultMessage: `Configure the xy chart's axis extents`,
+  }),
+  inputTypes: ['null'],
+  args: {
+    mode: {
+      types: ['string'],
+      options: [...Object.values(AxisExtentModes)],
+      help: i18n.translate('expressionXY.axisExtentConfig.extentMode.help', {
+        defaultMessage: 'The extent mode',
+      }),
+    },
+    lowerBound: {
+      types: ['number'],
+      help: i18n.translate('expressionXY.axisExtentConfig.lowerBound.help', {
+        defaultMessage: 'Lower bound',
+      }),
+    },
+    upperBound: {
+      types: ['number'],
+      help: i18n.translate('expressionXY.axisExtentConfig.upperBound.help', {
+        defaultMessage: 'Upper bound',
+      }),
+    },
+  },
+  fn(input, args) {
+    return {
+      type: AXIS_EXTENT_CONFIG,
+      ...args,
+    };
+  },
+};

src/plugins/chart_expressions/expression_xy/common/expression_functions/axis_titles_visibility_config.ts

@@ -0,0 +1,53 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { i18n } from '@kbn/i18n';
+import type { ExpressionFunctionDefinition } from '../../../../expressions/common';
+import { AXIS_TITLES_VISIBILITY_CONFIG } from '../constants';
+import { AxesSettingsConfig, AxisTitlesVisibilityConfigResult } from '../types';
+
+export const axisTitlesVisibilityConfigFunction: ExpressionFunctionDefinition<
+  typeof AXIS_TITLES_VISIBILITY_CONFIG,
+  null,
+  AxesSettingsConfig,
+  AxisTitlesVisibilityConfigResult
+> = {
+  name: AXIS_TITLES_VISIBILITY_CONFIG,
+  aliases: [],
+  type: AXIS_TITLES_VISIBILITY_CONFIG,
+  help: i18n.translate('expressionXY.axisTitlesVisibilityConfig.help', {
+    defaultMessage: `Configure the xy chart's axis titles appearance`,
+  }),
+  inputTypes: ['null'],
+  args: {
+    x: {
+      types: ['boolean'],
+      help: i18n.translate('expressionXY.axisTitlesVisibilityConfig.x.help', {
+        defaultMessage: 'Specifies whether or not the title of the x-axis are visible.',
+      }),
+    },
+    yLeft: {
+      types: ['boolean'],
+      help: i18n.translate('expressionXY.axisTitlesVisibilityConfig.yLeft.help', {
+        defaultMessage: 'Specifies whether or not the title of the left y-axis are visible.',
+      }),
+    },
+    yRight: {
+      types: ['boolean'],
+      help: i18n.translate('expressionXY.axisTitlesVisibilityConfig.yRight.help', {
+        defaultMessage: 'Specifies whether or not the title of the right y-axis are visible.',
+      }),
+    },
+  },
+  fn(inputn, args) {
+    return {
+      type: AXIS_TITLES_VISIBILITY_CONFIG,
+      ...args,
+    };
+  },
+};